> ## Documentation Index
> Fetch the complete documentation index at: https://clickhouse.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

> 内置 Web SQL UI（`/play`）中固定（sticky）列的文档

# Web UI 固定列

内置的 Web SQL UI (`play.html`，通过任意 ClickHouse HTTP 端口上的 [`/play`](/docs/zh/concepts/features/interfaces/http) 路径提供) 可以在结果中保持所选列可见，同时让表格其余部分横向滚动。固定列会贴靠在结果区域靠近的一侧边缘，而不会随滚动移开，因此关键列——标识符、名称、日期——无论你正在查看最右侧的哪一列，都会始终显示在旁边。

<div id="pinning-a-column">
  ## 固定列
</div>

每个列标题左侧都会显示一个 📌 图钉图标。点击即可固定该列；再次点击则取消固定。该图标是一个真正的按钮，因此键盘用户可以通过 Tab 键将焦点移到它上面，并用键盘切换其状态；同时，它还会将固定状态传达给辅助技术。

在带有悬停指针 (如鼠标) 的设备上，只有当鼠标悬停在列标题上或切换控件获得焦点时，图标才会显示，因此平时不会碍事；在触摸设备和其他粗指针设备上，由于没有悬停状态，图标会始终显示，以便直接点按。已固定的列会始终以完整显示的图标作为提示，表明该列已固定。

<div id="when-pinning-is-available">
  ## 何时可使用固定
</div>

只有当表足够宽、可以水平滚动时，才会提供固定功能。当整个表都能完整显示在视口内时，就没有内容会滚出视野，因此固定开关会被禁用，并且不会出现在键盘 Tab 键的焦点顺序中。一旦结果变得可以水平滚动——例如结果很宽、窗口很窄，或流式结果在水平方向不断扩展——这些开关就会启用。

<div id="how-a-pinned-column-behaves-when-scrolling">
  ## 固定列在滚动时的表现
</div>

固定列在水平滚动时会随内容一起移动，直到即将移出视口；这时它会吸附在靠近的一侧边缘——左侧的列吸附在左边缘，右侧的列吸附在右边缘——并保持可见。多个固定列会按原始顺序沿边缘依次排列，每一列都通过边框与滚动内容隔开。固定单元格会覆盖其下方正常滚动的单元格，包括已选中的单元格，因此始终清晰可读。

<div id="shared-across-results">
  ## 在各结果间共享
</div>

固定列会按列名进行跟踪，并像每列的[颜色编码模式](/docs/zh/concepts/features/interfaces/web-ui-color-coding)一样，在页面上的所有结果表之间共享。在某个结果中固定名为 `id` 的列后，其他结果中名为 `id` 的列，以及后续查询返回的同名列，也都会保持固定。

<div id="persistence">
  ## 持久化
</div>

已固定的列集合会保存在页面 URL、浏览器历史记录以及各个选项卡的结果快照中，因此重新加载页面、共享链接或前后导航时，它都会被保留。为保持紧凑，只会存储已固定的列——空集合不会向 URL 或历史状态中添加任何内容。

<div id="limitations">
  ## 限制
</div>

* 纵向 (转置) 的单行布局没有可水平滚动的列，因此不支持固定。
