引入
HTML 中有些属性不是某个标签专属的，而是很多标签都可以使用。
这些属性叫全局属性，用来给元素添加标识、分类、提示、样式、语言等通用信息。
正文
定义
定义
HTML 全局属性是大多数 HTML 元素都可以使用的属性，不只属于某一个特定标签。
例如 id、class、style、title 就是很常见的全局属性。
它们可以写在 <p>、<div>、<a>、<img> 等很多标签上。
语法
<element attribute="value">内容</element>例如：
<p id="intro" class="text">这是一段文字</p>这里的 id 和 class 都是全局属性。
id
id 用于给元素设置唯一标识。
<h1 id="title">HTML 全局属性</h1>一个页面中，同一个 id 不建议重复。
常见用途：
- 配合 CSS 精确选择某个元素
- 配合 JavaScript 找到某个元素
- 配合锚点跳转到页面指定位置
锚点例子
<a href="#section1">跳转到第一部分</a>
<h2 id="section1">第一部分</h2>href="#section1" 会跳转到 id="section1" 的位置。
class
class 用于给元素添加分类。
<p class="note">这是一条提示。</p>多个元素可以使用同一个 class。
<p class="note">提示一</p>
<p class="note">提示二</p>一个元素也可以有多个 class，中间用空格隔开。
<p class="note important">重要提示</p>class 最常见的用途是配合 CSS 批量设置样式。
style
style 用于直接给元素添加行内样式。
<p style="color: red;">红色文字</p>虽然它很方便，但不建议大量使用。
如果样式比较多，最好写到 CSS 文件中统一管理。
title
title 用于给元素添加额外说明。
<abbr title="HyperText Markup Language">HTML</abbr>鼠标悬停在元素上时，浏览器通常会显示 title 的内容。
它适合放一些简短提示，但不能把重要信息只放在 title 里，因为移动端和辅助工具不一定都方便查看。
hidden
hidden 用于隐藏元素。
<p hidden>这段文字默认隐藏。</p>hidden 是布尔属性，写上它就表示这个元素被隐藏。
被隐藏的内容通常不会显示在页面上。
data-*
data-* 用于给元素保存自定义数据。
<button data-id="1001" data-role="delete">删除</button>data-* 中的 * 可以换成自定义名称，例如：
data-iddata-userdata-type
它常用于配合 JavaScript 读取元素上的额外数据。
contenteditable
contenteditable 用于设置元素内容是否可以被用户编辑。
<p contenteditable="true">这段文字可以直接编辑。</p>常见值：
true表示可以编辑false表示不能编辑
它只是让页面内容可以被编辑，不代表修改内容会自动保存。
如果要保存，还需要 JavaScript 或后端处理。
lang
lang 用于说明元素内容使用的语言。
<html lang="zh-CN">也可以写在某个具体元素上。
<p lang="en">Hello HTML</p>lang 对搜索引擎、翻译工具和无障碍工具都有帮助。
dir
dir 用于设置文字方向。
<p dir="ltr">从左到右显示</p>
<p dir="rtl">从右到左显示</p>常见值：
ltr表示从左到右rtl表示从右到左
中文和英文通常是 ltr。
tabindex
tabindex 用于控制元素能否通过键盘 Tab 键聚焦，以及聚焦顺序。
<button tabindex="0">按钮</button>常见写法：
tabindex="0"表示可以按正常顺序聚焦tabindex="-1"表示不能通过Tab聚焦，但可以用 JavaScript 聚焦
这个属性和键盘操作、无障碍体验有关。
draggable
draggable 用于设置元素是否可以拖动。
<img src="image.jpg" alt="示例图片" draggable="true">常见值：
true表示可以拖动false表示不可以拖动
实际拖拽效果通常还需要 JavaScript 配合。
常见组合例子
给文章卡片添加属性
<article id="post-1" class="card article-card" data-id="1" title="文章卡片">
<h2>HTML 全局属性</h2>
<p>这些属性可以用在大多数 HTML 标签上。</p>
</article>这个例子中：
id用来标识唯一文章class用来分类和设置样式data-id用来保存自定义数据title用来提供额外说明
特点
- 全局属性可以用在大多数 HTML 元素上
id用于唯一标识，一个页面中不建议重复class用于分类，可以重复使用style用于行内样式，但不建议大量使用title用于补充提示信息hidden可以隐藏元素data-*可以保存自定义数据lang、tabindex等属性和 SEO、无障碍体验有关
注意事项
id不要重复，否则 CSS、JavaScript、锚点可能出现混乱class可以写多个，但命名要清晰- 不要把大量样式都写在
style中，复杂样式交给 CSS - 不要把关键内容只放在
title中，用户不一定能看到 hidden只是隐藏显示，不适合用来保存敏感信息data-*适合存简单数据，不要把复杂业务逻辑都塞进 HTML 属性里tabindex不要乱设很大的数字，容易影响键盘操作顺序
理解
可以把全局属性理解为 HTML 元素的“通用配置”。
标签决定页面中有什么内容，全局属性则给这些内容补充身份、分类、提示、样式和行为信息。
它们不一定改变标签本身是什么，但会让元素更容易被 CSS、JavaScript、浏览器和用户理解。
引出
理解全局属性之后，可以继续学习 HTML 元素属性，再区分哪些属性是通用的，哪些属性是某些标签专用的。