HTML5结构标签无专属属性，仅继承全局属性；常用全局属性包括id、class、data-、hidden、tabindex、lang、title；慎用role和aria-以免破坏原生语义；结构标签重在语义准确而非属性堆砌。
HTML5结构标签本身不带特有属性，只继承全局属性
HTML5新增的 <header></header>、<nav></nav>、<main></main>、<article></article>、<section></section>、<aside></aside>、<footer></footer> 这些语义化结构标签，**没有专属属性**。它们的作用纯粹是表达文档逻辑结构，浏览器不会因用了 <section></section> 就自动加样式或行为——所有可设置的属性，都来自 HTML 的「全局属性」（Global Attributes）。
必须掌握的 7 个常用全局属性
这些属性可写在任意 HTML 元素上（包括结构标签），但实际高频使用的就这几个：
-
id：唯一标识符，用于 CSS 选择、JS 获取（document.getElementById()）、锚点跳转（#my-header） -
class：多值空格分隔的类名，主要供 CSS 和 JS 批量操作（class="sidebar dark-mode"） -
data-*：自定义数据属性，如data-user-id="123"，JS 通过element.dataset.userId读取，不影响渲染 -
hidden：布尔属性，设为hidden或hidden=""即隐藏元素（等效于display: none），注意它不移除 DOM -
tabindex：控制键盘 Tab 导航顺序和是否可聚焦（tabindex="0"加入流式导航，tabindex="-1"仅 JS 可聚焦） -
lang：声明内容语言（如lang="zh-CN"），影响拼写检查、语音合成、搜索引擎语义识别 -
title：鼠标悬停时显示工具提示，但无障碍支持弱，不推荐替代<label></label>或 ARIA
结构标签中容易误用的属性场景
虽然能写，但某些属性在语义容器里意义不大或有隐含问题：
-
role属性慎用：比如给<nav></nav>再加role="navigation"是冗余的，浏览器已内置对应 ARIA role；只有当语义被破坏（如用<div> 模拟 <code><main></main>）才需补role="main" -
aria-*不要随意覆盖原生语义：给<header></header>加aria-label="页脚"会误导屏幕阅读器，直接违背结构标签存在意义 -
style属性可用，但结构标签应专注语义，样式交给 CSS 类控制；内联样式会让维护变困难，也削弱响应式能力 -
onclick等事件内联属性不推荐：结构标签不是交互控件，点击行为应由子元素（如按钮、链接）承载，否则违反“语义与行为分离”原则
兼容性与性能影响很小，但语义错误后果严重
所有全局属性在现代浏览器中完全支持，连 IE11 都支持 data-*、hidden、tabindex 等核心属性。性能上几乎零开销——它们只是字符串属性，不触发重排重绘。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记（深入）”；
真正关键的是语义误用：比如把多个 <article></article> 嵌套在同一个 <section></section> 里没问题，但把整个页面塞进一个 <article></article> 就违反了“独立可分发内容”的定义；又比如用 <footer></footer> 包裹广告横幅，会干扰辅助技术对页脚信息的提取。
结构标签的价值不在属性多少，而在你是否按内容本质去选——<section></section> 是主题分组，<article></article> 是可独立传播单元，<aside></aside> 是附属但相关的内容。属性只是辅助，别让它掩盖了语义判断这一步。
