一、属性
属性提供了关于元素的额外信息，这些信息可以是元素的行为、样式或其他特性。属性以名称/值对的形式出现，通常写在开始标签中。让我们来看一些常见的HTML属性及其用法：
1. id 属性
id 属性用于为元素指定唯一的标识符。通过 id 属性，可以在CSS和JavaScript中方便地选择和操作特定的元素。
<div id="unique-id">This is a div element with an id</div>
2. class 属性
class 属性用于为元素指定一个或多个类名，类名用空格分隔。通过类名，可以在CSS中为多个元素应用相同的样式。
<p class="paragraph primary">This is a paragraph with classes</p>
3. href 属性
href 属性用于指定超链接的目标地址。当用户点击该链接时，将会跳转到 href 属性指定的URL。
<a href="https://www.example.com">This is a link to example.com</a>
4. src 属性
src 属性用于指定图像、音频、视频等资源的路径。
<img src="image.jpg" alt="Description of the image">
5. alt 属性
alt 属性用于为图像元素提供替代文本，当图像无法加载时，或者用户使用辅助技术（如屏幕阅读器）时，会显示 alt 属性的文本。
<img src="image.jpg" alt="Description of the image">
6. title 属性
title 属性用于为元素提供额外的提示信息，当用户将鼠标悬停在具有 title 属性的元素上时，浏览器会显示该提示信息。
<a href="https://www.example.com" title="Go to example.com">This is a link</a>
示例：
<div id="header" class="header">
<h1>Welcome to my website</h1>
<img src="logo.png" alt="Website Logo" title="My Website Logo">
<a href="https://www.example.com" class="btn primary" title="Go to example.com">Visit Example</a>
</div>
二、标题
标题元素（Heading Elements）用于定义标题或子标题，并且分为六个级别，从 <h1> 到 <h6>。这些标题元素有助于组织和结构化文档内容，并且在视觉上也会有不同的样式以显示不同级别的重要性。
下面是各级标题元素的示例以及其在文档结构中的作用：
1. <h1> 标题
<h1>This is the main heading</h1>
- 主标题，一般用于页面或页面中的主要部分。
2. <h2> 标题
<h2>This is a subheading</h2>
- 次级标题，用于主标题的下一级子标题。
3. <h3> 标题
<h3>This is a subheading</h3>
- 次级标题，用于
<h2>标题下的子标题，以此类推。
4. <h4>、<h5>、<h6> 标题
<h4>This is a subheading</h4>
<h5>This is a subheading</h5>
<h6>This is a subheading</h6>
- 这些标题用于更多层次的标题，根据需要使用。
示例结构：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Main Title</h1>
<p>This is the main content of the document.</p>
<h2>Subsection Title</h2>
<p>This is a subsection within the main content.</p>
<h3>Sub-subsection Title</h3>
<p>This is a sub-subsection within the subsection.</p>
<h2>Another Subsection Title</h2>
<p>This is another subsection within the main content.</p>
</body>
</html>
三、段落
段落元素<p> 用于定义文本的段落，它是网页内容中最基本的文本组织方式之一。段落元素可以包含任意文本内容，通常会在段落之间插入空白行来显示不同的段落。
下面是段落元素的示例：
<p>This is a paragraph.</p>
在实际应用中，段落元素通常会包含大量文本内容，以形成完整的段落。例如：
<p>先帝创业未半而中道崩殂，今天下三分，益州疲弊，此诚危急存亡之秋也。然侍卫之臣不懈于内，忠志之士忘身于外者，盖追先帝之殊遇，欲报之于陛下也。诚宜开张圣听，以光先帝遗德，恢弘志士之气，不宜妄自菲薄，引喻失义，以塞忠谏之路也。</p>
段落元素可以与其他 HTML 元素结合使用，例如链接、图像等，以创建更丰富的内容。例如：
<p>This is a paragraph with a <a href="https://www.example.com">link</a> and an <img src="image.jpg" alt="Image description"> image.</p>