10 个常用的 HTML 属性

1. id

• 用途：为元素定义唯一标识符
• 特点：在整个 HTML 文档中必须是唯一的
• 示例：

• <div id="header">这是页面头部</div>

   

2. class

• 用途：为元素定义一个或多个类名，用于样式化和 JavaScript 操作
• 特点：可以在多个元素间共享
• 示例：

• <p class="text-center highlight">这是一个居中高亮的段落</p>

   

3. src

• 用途：规定外部资源的 URL
• 适用元素：<img>, <script>, <iframe>, <video>, <audio>等
• 示例：

• <img src="image.jpg" alt="图片"> <script src="script.js"></script>

                              

4. href

• 用途：规定链接的目标 URL
• 适用元素：<a>, <link>, <area>等
• 示例：

• <a href="https://www.example.com">访问示例网站</a> <link href="styles.css" rel="stylesheet">

   

5. alt

• 用途：为图像定义替代文本
• 重要性：提高可访问性，图像无法显示时显示此文本
• 示例：

• <img src="logo.png" alt="公司logo">

   

6. style

• 用途：为元素定义内联样式
• 特点：优先级高于外部 CSS
• 示例：

• <p style="color: blue; font-size: 18px;">这是蓝色的文本</p>

   

7. width 和 height

• 用途：规定元素的宽度和高度
• 适用元素：<img>, <iframe>, <video>, <canvas>等
• 示例：

• <img src="photo.jpg" width="400" height="300">

   

8. title

• 用途：规定元素的额外信息
• 表现：鼠标悬停时显示为工具提示
• 示例：

• <a href="#" title="这是一个链接">悬停查看提示</a>

   

9. disabled

• 用途：规定元素应该被禁用
• 适用元素：表单元素如<button>, <input>, <select>等
• 示例：

• <button type="submit" disabled>提交</button> <input type="text" disabled value="这是禁用的输入框">

   

10. placeholder

• 用途：规定输入字段的提示文本
• 适用元素：<input>, <textarea>
• 示例：

• <input type="text" placeholder="请输入您的姓名">