IT课程 HTML基础 010_元素、属性
2024-10-30 10:35:21 # 学习 # HTML基础

元素

开始标签 元素内容 结束标签
<h1> 这是一个标题 </h1>
<p> 这是一个段落 </p>
<a href="https://www.zhaojian.net/" title="链接"> 这是一个链接 </a>
<img src="/images/logo.png" alt="这是一个图像"> 这是一个图像
<br> 换行
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8" />
<title>hello HTML</title>
</head>

<body>
<h1>这是一个标题</h1>
<p>
这是一个段落<br>
<a href="https://www.zhaojian.net/" title="链接">这是一个链接</a>
</p>
<img src="/images/logo.png" alt="这是一个图像" />
<br />
</body>

</html>

[!小结]

  • HTML 元素开始标签 开始(起始),以 结束标签 结束(终止)
  • HTML 元素 的内容是开始标签与结束标签之间的内容
  • 某些 HTML 元素 具有 空内容(empty content),这些没有内容,也没有闭合的标签被称为空标签空元素,为了实现特定功能并保持简洁性和灵活性,如:<br><hr><img><meta><input>等。
  • 大多数 HTML 元素 可拥有 属性
  • HTML 元素 通常被称为 HTML 标签 (HTML tag)
  • HTML 元素 通常是 成对出现 的,比如 <p></p>
  • HTML 元素 内可以嵌套其他 HTML 标签
  • HTML 元素 对大小写不敏感,推荐使用小写

属性

HTML 元素可以拥有属性(Attribute),它们提供了有关元素的更多信息,或者定义了元素的某些行为。属性总是在开始标签中定义,常常使用 “属性名=属性值” 的形式出现。例如,链接(a)元素可以使用 href 属性指定链接的目标地址:

示例:

1
<a href="https://www.zhaojian.net">zhaoJian.Net</a>

效果:

示例效果

在上述代码中,a 元素的 href 属性的值为 "https://www.zhaojian.net",这意味着当点击该链接时,浏览器将跳转到该 URL。

常用的属性:

  1. id:为元素提供一个唯一标识符。
  2. class:为元素提供一个或多个类名,不同的元素可以添加相同的类名。
  3. style:为元素提供内联样式。
  4. title:为链接元素增加标题内容。
  5. alt:为图像元素增加描述内容。

[!小结]

  • 属性总是以 名称=值对 的形式出现,比如:name="value"
  • 在属性与元素名称(或上一个属性,如果有超过一个属性的话)之间加以空格符分隔。
  • 属性值应该始终被包括在引号内,双引号是最常用的,不过使用单引号也没有问题。
  • 属性和属性值对大小写不敏感,推荐使用小写。