For AI agents: the complete documentation index is available at https://a3s-lab.github.io/UI/v0.2.0/llms.txt, the full documentation bundle is available at https://a3s-lab.github.io/UI/v0.2.0/llms-full.txt, and this page is available as Markdown at https://a3s-lab.github.io/UI/v0.2.0/components/workspace-header.md.
A3S UI
  • 简体中文
  • v0.2.0

      • 工作区标题栏

      工作区标题使导航、资源标识、上下文元数据和高价值操作在编辑器和运维控制台之间保持一致。

      Live previewHTML · CSS · JavaScript
      GW

      生产网关

      ACL 配置 · 12 秒前保存
      健康

      用途

      <header class="workspace-header">
  <div data-workspace-leading>...</div>
  <div data-workspace-identity><h1>Resource name</h1><span>Metadata</span></div>
  <div data-workspace-actions>...</div>
</header>

      参数

      参数必填目的
      data-workspace-leading可选返回、菜单或资源类型控件
      data-workspace-identity是可伸缩的标题与元数据区域
      data-workspace-actions可选右对齐上下文操作
      data-collapse="mobile"可选隐藏低于 640 像素的次要内容
      --workspace-header-height可选稳定的标题栏高度，默认 3.125rem（50px）

      状态

      使用相邻的 Badge 或状态文本表示保存、验证和运行状况。不要在标头类本身中对应用程序状态进行编码。

      可访问性

      将一页级 <h1> 保留在标识区域内。图标按钮需要可访问的名称。可编辑的名称应在生产中使用带标签的输入； contenteditable 仅用于在预览中演示实时文本。