全局属性
HTML全局属性是指可以在所有HTML元素中使用的通用属性。全局属性可以用于几乎所有HTML元素,具有广泛的适用性和灵活性。
1. class
class属性为元素定义一个或多个类名,用空格分隔。类名不必在 HTML 中以点号开头。这个属性常被用于 CSS 来设置元素的样式。
<div class="example">
<p class="highlight">这是一个样式被设置为高亮的段落</p>
</div>
2. contenteditable
contenteditable属性设置元素是否可编辑。属性的值可以为 true、false 或 inherit。如果值为 true,则可编辑;如果值为 false,则不能编辑。如果值为 inherit,则继承父元素的此属性值。
<div contenteditable="true">
<p>这段文字可以编辑。</p>
</div>
3. data-*
data-*用于存储自定义数据,这些数据可以使用 JavaScript 来访问和修改。* 表示任意名称。开发人员可以根据需要自定义数据的名称。
<p data-animal="cat" data-color="black">这是一只黑色的猫。</p>
4. dir
dir属性定义元素文本的方向。属性的值可以为 ltr(从左到右)或 rtl(从右到左),默认值为 ltr。
<p dir="rtl">这个段落的文本方向是从右到左。</p>
5. hidden
hidden属性用于隐藏元素。
<div hidden>这个元素将被隐藏。</div>
6. id
id属性定义元素的唯一标识符。每个页面中的元素都应该有一个唯一的 ID。
<div id="header">
<h1>这是页面的标题</h1>
</div>
7. lang
lang属性定义元素内容的语言。属性的值应该是 BCP 47 语言标记的缩写表示。
<p lang="en">This is a paragraph in English.</p>
<p lang="ja">これは日本語で書かれた段落です。</p>
8. style
style属性用于为元素设置内联样式。此属性的值应该是一个键值对列表,各键值对之间用分号分隔。
<p style="font-size: 18px; color: blue">这是一个样式被设置为蓝色的大号字体段落。</p>
9. tabindex
tabindex属性定义元素可以通过 tab 键访问的顺序。它允许用户改变默认的 tab 键次序,因此用户可以在网页上更容易的使用键盘导航。属性的值可以是正整数、0 或 -1。正整数代表元素被选中的顺序,0 代表元素可以被 tab 键访问,但不能通过 tab 键访问;-1 代表元素不能被通过 tab 键访问。
<input type="text" tabindex="1">
<input type="submit" tabindex="2">
<input type="checkbox" tabindex="3">
10. title
title属性定义元素的额外信息,常用于元素的悬停文本。悬停在元素上时,浏览器将显示 title 内容。
<img src="cat.jpg" alt="一只可爱的猫" title="这是一只可爱的猫">
除了以上这些全局属性之外,还有一些其他全局属性。但是,这些全局属性仅适用于某些元素,我们不在本文中进行介绍。