详解HTML编程的标记与文档结构-前端开发

HTML (Hypertext Markup Language) 是一种用于创建网页的标记语言。HTML 语言使用各种不同的标记来定义网页的文本、图片、超链接等元素样式，这些标记被称为 HTML 标签。

HTML (Hypertext Markup Language) 是一种用于创建网页的标记语言。HTML 语言使用各种不同的标记来定义网页的文本、图片、超链接等元素样式，这些标记被称为 HTML 标签。

HTML编程标记

文本标记

用来定义文本的样式和排版方式，比如 <h1> 标签用于定义一级标题，<p> 标签用于定义段落等。

链接标记

用来定义链接，让用户可以点击跳转到其他网页或者内部文档位置，比如 <a href="url">link text</a>，其中 href 属性定义跳转的目标网页链接。

图像标记

用来插入图像，比如 <img src="image.png" alt="description">，其中 src 属性定义图像的地址，alt 属性定义当图像无法加载时的替代文本。

列表标记

用来创建有序或无序列表，比如 <ul> 和 <li> 标签用于创建无序列表，<ol> 和 <li> 标签用于创建有序列表。

表格标记

用来创建表格，比如 <table> 标签用于定义表格，<tr> 标签用于定义行，<th> 标签用于定义表头单元格，<td> 标签用于定义其他单元格。

...

文档结构

HTML 网页文档由头部和主体两个部分组成。

头部部分

头部包含 HTML 文档的元数据，如 <head>、<title>、<meta> 等标记。

<head> 标记用于定义头部，其中包含了文档的标题、关键词和描述等信息。<title> 标记用于定义文档的标题，显示在浏览器标签页上。<meta> 标记用于定义文档的元数据，如编码格式等。

主体部分

主体部分包含页面的内容，如 <body> 标记用于定义主体部分。

例如，以下是一个简单的 HTML 网页结构示例：

<!DOCTYPE html>
<html>
<head>
    <title>My Webpage</title>
    <meta charset="utf-8">
</head>
<body>
    <h1>Hello, World!</h1>
    <p>Welcome to my webpage!</p>
</body>
</html>

示例说明

示例1：创建超链接

以下是一个创建超链接的例子：

<a href="https://www.baidu.com">百度一下，你就知道</a>

在上面的例子中，<a> 标签创建了一个超链接，href 属性定义了跳转链接的目标页面地址，百度一下，你就知道 是链接的文本显示内容。

示例2：创建表格

以下是一个创建表格的例子：

<table>
    <tr>
        <th>姓名</th>
        <th>年龄</th>
    </tr>
    <tr>
        <td>张三</td>
        <td>25</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>28</td>
    </tr>
</table>

这个例子创建了一个简单的表格。<table> 标记定义了表格的基本结构，<tr> 标记定义了行，<th> 标记定义表头单元格，<td> 标记定义其他单元格。