二维码
搜索 ×

HTML 属性

  • 作者：图形开发学院
  • 更新时间：2023年11月01日
  • 阅读量：0
  • 收藏数：0

HTML 属性

HTML 属性提供有关 HTML 元素的其他信息。

HTML 属性

  • 所有 HTML 元素都可以具有属性
  • 属性提供有关元素的其他信息
  • 属性始终在开始标记中指定
  • 属性通常以名称/值对的形式出现，例如：name=“value”

href 属性

标记定义超链接。该属性指定页面的 URL 链接转到：<a>``href

1
<a href="http://www.adamsw.com">adamsw</a>

您将在我们的 HTML 链接中了解有关链接的更多信息[章]。

src 属性

该标签用于嵌入 HTML 页面中的图像。属性 指定要显示的图像的路径：<img>``src

1
<img src="img_girl.jpg">

有两种方法可以在属性中指定 URL：src

1.绝对 URL - 指向托管的外部图像的链接 在另一个网站上。示例：src=“http://adamsw.com/assets/img/features/hjqjfa_dl_tmyq.jpg”。

笔记： 外部图像可能受版权保护。如果你这样做 未获得使用许可，则可能违反版权法。在 此外，您无法控制外部图像;它可以突然被移除或 改变。

2. 相对 URL - 指向托管在 网站。在这里，URL 不包括域名。如果 URL 以 如果没有斜杠，它将相对于当前页面。示例：src=“hjqjfa_dl_tmyq.jpg”。 如果 URL 以斜杠开头，则它将相对于域。示例：src=“/img/features/hjqjfa_dl_tmyq.jpg”。

提示： 几乎总是最好使用相对 URL。他们 如果您更改域，则不会中断。

宽度和高度属性

标记还应包含 和 属性，这些属性指定宽度和 图像高度（以像素为单位）：<img>``width``height

1
<img src="img_girl.jpg" width="500" height="600">

alt 属性

标签的必需属性指定 图像的替代文本（如果由于某种原因无法显示图像）。 这可能是由于 连接速度慢，或属性错误，或者用户使用屏幕 读者。alt``<img>``src

1
<img src="img_girl.jpg" alt="Girl with a jacket">

1
2
3
看看如果我们尝试显示不存在的图像会发生什么：

<img src="img_girl.jpg" alt="Girl with a jacket">

您将在我们的 [HTML 图像章节]中了解有关图像的更多信息。

style 属性

该属性用于向 元素，例如颜色、字体、大小等。style

1
<p style="color:red;">This is a red paragraph.</p>

您将在我们的 [HTML 样式一章]中了解有关样式的更多信息。

lang 属性

应始终包含该属性 在标记中，声明 网页的语言。这是为了帮助搜索引擎和浏览器。lang``<html>

以下示例将英语指定为语言：

1
2
3
4
5
6
<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>

国家/地区代码也可以添加到属性中的语言代码中。因此，前两个字符定义了 HTML 页面的语言， 最后两个字符定义了国家。lang
以下示例将英语指定为语言，将美国指定为 国家：

1
2
3
4
5
6
<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html>

您可以在我们的 HTML 语言代码参考中看到所有[语言代码]。

title 属性

该属性定义了一些额外的 有关的信息 元素。title
在以下情况下，title 属性的值将显示为工具提示 将鼠标悬停在元素上：

1
<p title="I'm a tooltip">This is a paragraph.</p>

我们建议：始终使用小写属性

HTML 标准不需要小写的属性名称。

title 属性（以及所有其他属性）可以用大写或小写来写 喜欢 TITLE 或 TITLE。

但是，建议在 HTML 中使用小写属性，而对于更严格的文档类型（如 XHTML）则要求使用小写属性。

我们始终使用小写的属性名称。

建议：始终引用属性值

HTML 标准不需要在属性值两边加上引号。

但是，建议在 HTML 中使用引号，并要求对 更严格的文档类型，如 XHTML。

好： 
1
<a href="/guide/HTML/Introduction.md">Visit our HTML tutorial</a>
坏： 
1
<a href=/guide/HTML/Introduction.md>Visit our HTML tutorial</a>

有时你必须使用引号。此示例不会显示 title 属性，因为它包含空格：

1
<p title=About adamsw>

我们总是在属性值周围使用引号。

单引号还是双引号？

属性值周围的双引号在 HTML 中最常见，但单引号 也可以使用引号。

在某些情况下，当属性值本身包含双引号时，需要使用单引号：

1
<p title='John "ShotGun" Nelson'>

反之亦然：

1
<p title="John 'ShotGun' Nelson">

本章小结

  • 所有 HTML 元素都可以具有属性
  • 的属性指定链接转到的页面的 URL``href <a>
  • 的属性指定要显示的图像的路径src <img>
  • 和属性 提供图像的大小信息width``height``<img>
  • 的属性为图像提供替代文本alt <img>
  • 该属性用于添加样式 添加到元素，例如颜色、字体、大小等style
  • 属性 的标记声明 网页的语言lang``<html>
  • 该属性定义了一些额外的 有关元素的信息title

HTML 属性参考

每个 HTML 元素的所有属性的完整列表列在我们的：[HTML 属性参考]中。

推荐教程