HTML 属性

属性是写在标签里的附加信息，用来描述元素的特征：图片的地址、链接的目标、文字的尺寸等，都由属性决定。如果说标签决定"这是什么元素"，属性就决定"这个元素长什么样、干什么用"。学会正确书写属性，网页才能按你的意图展示。

属性的基本语法

属性写在开始标签里，写法是 属性名="属性值"，多个属性之间用空格隔开：

<a href="https://example.com">访问同类教程</a>
<img src="logo.png" width="200" height="100">

其中 href、src、width 是属性名，等号右边引号里的是属性值。绝大多数属性都是"名="值""这种键值对形式。

常用属性一览

• href：链接要跳转的网址，用在 <a> 上。
• src：图片、脚本等外部资源的地址，用在 <img>、<script> 上。
• alt：图片无法显示时的替代文字，用在 <img> 上，对无障碍和 SEO 都很重要。
• width / height：元素的宽和高。
• id：元素的唯一身份证，一个页面里不能重复。
• class：给元素分组命名，方便 CSS 批量设置样式。

<img src="cat.png" alt="一只橘猫" width="300">

在浏览器中显示为：一张 300 像素宽的橘猫图片；若图片加载失败，则显示文字"一只橘猫"。

单引号还是双引号

属性值推荐用双引号包裹，但引号内若需要再写引号（例如 title 提示语里带英文引号），可改为单引号包裹：

<p title="提示：这是段落">双引号写法</p>
<p title='他说 "你好"'>单引号包裹双引号</p>

两种写法浏览器都认，关键是别漏了引号：属性值含有空格却没有引号时，会被浏览器错误地拆成多个属性。

常见错误与坑

• 属性名和属性值都要小写书写，标签名同理（HTML5 虽然不区分大小写，但统一小写是规范）。
• 属性值里的空格会被截断，务必用引号包住整个值。
• 同一个属性在一个标签里只能写一次，重复写后面的会覆盖前面的。
• class 可填多个类名（用空格分开），id 只能有一个且全局唯一。

<p class="intro important">同时拥有两个类名</p>

小结

属性以 名="值" 的形式写在开始标签中，为元素补充地址、尺寸、身份等信息；注意引号包裹、统一小写、id 唯一。掌握属性写法后，下一节我们认识最常用的元素之一——标题。