好的，这是一篇关于HTML标签用法的原创文章，旨在为初学者和需要回顾的开发者提供一个清晰、系统的概览。
---
### **HTML的标签用法介绍：构建网页的基石**
在数字世界的万千景象背后，是无数行代码精心构筑的骨架。而HTML，正是这骨架的核心。它并非一门编程语言，而是一种**标记语言**，其精髓就在于“标签”。如果说网页是一座房子，那么HTML标签就是构成这座房子的砖瓦、梁柱和门窗。本文将带您系统地了解HTML标签的核心用法，揭开网页构建的神秘面纱。
#### **一、什么是HTML标签？**
HTML标签是由尖括号包围的关键词，例如 ``、`
`、`
`。它们通常成对出现，形成一个“元素”：
我的第一个网页
* ``：定义文档使用UTF-8字符编码，确保中文等字符正确显示。
* ``：定义浏览器标签页上显示的标题，对SEO至关重要。<br />
4. **`<body>`**：**主体元素**，包含了所有显示在网页上的可见内容，如文本、图片、视频等。</p>
<p>#### **三、常用内容标签详解**</p>
<p>在 `<body>` 中，我们使用各种标签来组织和呈现内容。</p>
<p>**1. 文本与标题**<br />
* **标题标签**：`</p>
<h1>` 到 `</p>
<h6>`，用于定义标题。`</p>
<h1>` 级别最高，字体最粗大，一个页面通常只有一个 `</p>
<h1>`，用于主标题。<br />
```html</p>
<h1 id="toc_2">一级标题</h1>
<h2 id="toc_3">二级标题</h2>
<p> ```<br />
* **段落标签**：`</p>
<p>`，用于定义段落文本。<br />
```html</p>
<p>这是一个普通的文本段落。</p>
<p> ```<br />
* **强调标签**：<br />
* `<strong>`：表示**重要**内容，通常以加粗显示。<br />
* `<em>`：表示*强调*内容，通常以斜体显示。</p>
<p>**2. 链接与图片**<br />
* **锚点标签**：`<a>`，用于创建超链接。`href` 属性指定链接的目标地址。<br />
```html<br />
<a href="https://www.example.com">访问示例网站</a><br />
```<br />
* **图片标签**：`<img>`，用于嵌入图像。它是自闭合标签。<br />
* `src` 属性指定图片的路径。<br />
* `alt` 属性提供图片的替代文本，在图片无法加载时显示，对无障碍访问和SEO非常重要。<br />
```html<br />
<img decoding="async" src="logo.png" alt="公司Logo"><br />
```</p>
<p>**3. 列表**<br />
* **无序列表**：`</p>
<ul>` 和 `</p>
<li>`，用于创建项目符号列表。<br />
```html</p>
<ul>
<li>咖啡</li>
<li>茶</li>
<li>牛奶</li>
</ul>
<p> ```<br />
* **有序列表**：`</p>
<ol>` 和 `</p>
<li>`，用于创建带编号的列表。<br />
```html</p>
<ol>
<li>第一步</li>
<li>第二步</li>
</ol>
<p> ```</p>
<p>**4. 分区与布局**<br />
* **`</p>
<div>`**：**块级容器**，是一个通用的内容分区，主要用于布局和样式化。它本身没有特定语义，只是将内容分组。<br />
```html</p>
<div class="header">这是页头</div>
<div class="content">这是主要内容</div>
<p> ```<br />
* **语义化标签**：HTML5引入了更具描述性的标签，让代码结构更清晰。<br />
* `</p>
<header>`：页眉。<br />
* `</p>
<nav>`：导航栏。<br />
* `<main>`：主要内容区。<br />
* `</p>
<article>`：独立的文章内容。<br />
* `</p>
<section>`：页面中的一个章节。<br />
* `</p>
<aside>`：侧边栏。<br />
* `</p>
<footer>`：页脚。<br />
```html<br />
<body></p>
<header>...</header>
<nav>...</nav>
<p> <main></p>
<article>...</article>
<aside>...</aside>
<p> </main></p>
<footer>...</footer>
<p> </body><br />
```</p>
<p>#### **四、标签的核心属性**</p>
<p>属性为HTML元素提供了附加信息，总是写在开始标签中，以 `名称="值"` 的形式出现。</p>
<p>* **全局属性**：几乎所有标签都支持的属性。<br />
* `id`：为元素指定唯一的标识符。<br />
* `class`：为元素指定一个或多个类名，用于CSS样式化和JavaScript操作。<br />
* `style`：用于内联CSS样式（不推荐大量使用）。<br />
* `title`：提供元素的额外提示信息，鼠标悬停时显示。</p>
<p>* **特定属性**：某些标签特有的属性。<br />
* `<a>` 的 `href`。<br />
* `<img>` 的 `src` 和 `alt`。<br />
* `<input>` 的 `type`。</p>
<p>#### **五、总结：善用标签，构建清晰结构**</p>
<p>HTML标签是Web开发的基石。理解并正确使用它们，是创建结构良好、语义清晰、易于维护和搜索引擎友好的网页的第一步。请记住以下最佳实践：</p>
<p>1. **语义化优先**：尽量使用 `</p>
<header>`, `</p>
<article>` 等有意义的标签，而不是全部用 `</p>
<div>`。<br />
2. **嵌套正确**：确保标签正确关闭和嵌套，避免交叉。<br />
3. **属性完整**：特别是 `<img>` 的 `alt` 属性和 `<a>` 的 `href` 属性，务必填写。<br />
4. **结构清晰**：一个清晰的HTML结构是后续CSS样式化和JavaScript交互的坚实基础。</p>
<p>从这些基础的标签出发，您已经掌握了构建任何复杂网页的起点。不断练习，您将能熟练运用这些“砖瓦”，筑起属于自己的数字大厦。</p>
<p><strong><img decoding="async" src="http://liuguangwu.top/wp-content/uploads/2025/10/微信图片_20251028222446_23616_19-300x98.png" /></strong></p>
<h1 id="toc_4"><strong>注册本站资源，关注公众号，送本站最低一年vip，最高可得终生vip，所有资源免费下载！！！！！！</strong></h1>
</div>
<div class="article-act">
<a href="javascript:;" class="article-zan" data-id="4334"><i class="icon icon-zan"></i> <span>0</span></a>
</div>
<div class="article-shares"><a href="javascript:;" data-url="https://liuguangwu.top/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d" class="share-weixin"><i class="icon icon-weixin"></i></a><a data-share="qzone" class="share-qzone" data-url="https://liuguangwu.top/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d"><i class="icon icon-qzone"></i></a><a data-share="weibo" class="share-tsina" data-url="https://liuguangwu.top/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d"><i class="icon icon-weibo"></i></a><a data-share="qq" class="share-sqq" data-url="https://liuguangwu.top/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d"><i class="icon icon-qq"></i></a><a data-share="douban" class="share-douban" data-url="https://liuguangwu.top/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d"><i class="icon icon-douban"></i></a></div> </article>
<nav class="article-nav">
<span class="article-nav-prev">上一篇<br><a href="https://liuguangwu.top/%e3%80%8a%e5%8b%87%e8%80%85%e6%96%97%e6%81%b6%e9%be%9912-hd-2d%e9%87%8d%e5%88%b6%e7%89%88%e3%80%8bpc%e6%a8%a1%e6%8b%9f%e5%99%a8%e6%95%b4%e5%90%88%e7%89%88%e4%b8%8b%e8%bd%bdv1-0-1" rel="prev">《勇者斗恶龙1+2 HD-2D重制版》PC模拟器整合版下载v1.0.1</a></span>
<span class="article-nav-next">下一篇<br><a href="https://liuguangwu.top/%e6%9c%80%e6%96%b0%e5%bd%a9%e8%99%b9%e4%ba%91%e5%95%86%e5%9f%8e%e7%b3%bb%e7%bb%9f%e6%ba%90%e7%a0%81-v7-2-%e8%87%aa%e5%8a%a9%e4%b8%8b%e5%8d%95%e7%b3%bb%e7%bb%9f-%e5%85%a8%e8%a7%a3%e7%89%88%e6%9c%ac" rel="next">最新彩虹云商城系统源码 V7.2 自助下单系统 全解版本无后门</a></span>
</nav>
<div class="single-comment">
<h3 class="comments-title" id="comments">
<i class="icon icon-comments"></i> 评论<small>0</small>
</h3>
<div id="respond" class="comments-respond no_webshot">
<form action="http://liuguangwu.top/wp-comments-post.php" method="post" id="commentform">
<div class="comt">
<div class="comt-title">
<img src="https://liuguangwu.top/wp-content/themes/modown/static/img/avatar.png" class="avatar avatar-50 photo" width="50" height="50" /> <p><a id="cancel-comment-reply-link" href="javascript:;">取消</a></p>
</div>
<div class="comt-comterinfo" id="comment-author-info" >
<ul>
<li><input class="ipt" type="text" name="author" id="author" value="" tabindex="2" placeholder="昵称"></li>
<li><input class="ipt" type="text" name="email" id="email" value="" tabindex="3" placeholder="邮箱"></li>
<li style="display: none"><input class="ipt" type="text" name="url" id="url" value="" tabindex="4" placeholder="网址"></li>
</ul>
</div>
<div class="comt-box">
<textarea placeholder="写点什么..." class="comt-area" name="comment" id="comment" cols="100%" rows="3" tabindex="1" onkeydown="if(event.ctrlKey&&event.keyCode==13){document.getElementById('submit').click();return false};"></textarea>
</div>
<div class="comt-ctrl">
<div class="comt-tips"></div>
<input type='hidden' name='comment_post_ID' value='4334' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
<button class="comt-submit" type="submit" name="submit" id="submit" tabindex="5">提交</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<aside class="sidebar">
<div class="theiaStickySidebar">
</div>
</aside> </div>
</div>
<footer class="footer">
<div class="container">
<div class="copyright"><p>本站所收集资源均来自网盘用户公开分享，不做任何盈利，仅作个人公益学习，其网盘资源文件的有效性和安全性需自行判断，请勿非法，商业传播，如有侵权，请发邮件（）进行投诉，我们将在确认本文链接指向的资源存在侵权后，立即删除相关介绍帖子！</p>
</div>
</div>
</footer>
<div class="rollbar">
<ul>
<li><a href="javascript:;" class="theme_night active"><i class="icon icon-moon" style="top:0"></i></a><h6>夜间模式<i></i></h6></li> <li class="totop-li"><a href="javascript:;" class="totop"><i class="icon icon-arrow-up"></i></a><h6>返回顶部<i></i></h6></li>
</ul>
</div>
<div class="footer-fixed-nav clearfix">
<a href="https://liuguangwu.top"><i class="icon icon-home2"></i><span>首页</span></a>
<a href="https://liuguangwu.top/all"><i class="icon icon-find"></i><span>发现</span></a>
<a href="https://liuguangwu.top/vip" class="special"><i class="icon icon-crown"></i><span>VIP</span></a>
<a href="https://liuguangwu.top/login" class="footer-fixed-nav-user signin-loader"><i class="icon icon-discuz"></i><span>我的</span></a>
<!--div class="footer-nav-trigger"><i class="icon icon-arrow-down"></i></div-->
</div>
<div class="sitetips sitetips-default">
<i class="icon icon-horn"></i> <b>注册本站资源，关注公众号，送本站最低一年vip，最高可得终生vip，所有资源免费下载！！！！！！</b>本站所收集资源均来自网盘用户公开分享，不做任何盈利，仅用作个人学习，其网盘资源文件的有效性和安全性需自行判断，请勿进行非法传播或商业传播！<a href="javascript:;" class="close"><i class="icon icon-close"></i></a>
</div>
<div class="sign">
<div class="sign-mask"></div>
<div class="sign-box">
<div class="sign-wrap">
<div class="sign-tips"></div>
<form id="sign-in">
<div class="form-item" style="text-align:center"><a href="https://liuguangwu.top"><img class="logo-login" src="https://liuguangwu.top/wp-content/themes/modown/static/img/logo.png" alt="流光坞"></a></div>
<div class="form-item"><input type="text" name="user_login" class="form-control" id="user_login" placeholder="用户名/邮箱"><i class="icon icon-user"></i></div>
<div class="form-item"><input type="password" name="password" class="form-control" id="user_pass" placeholder="密码"><i class="icon icon-lock"></i></div>
<div class="form-item form-slide-item" id="form-slide-item2">
<div id="captcha-slide2" class="captcha-slide2"><i class="icon icon-arrow-long-right"></i></div>
<span id="verification-status2">请拖动滑块到最右边</span>
<input type="hidden" id="user_captcha" name="user_captcha">
</div>
<div class="sign-submit">
<input type="button" class="btn signinsubmit-loader" name="submit" value="登录">
<input type="hidden" name="action" value="signin">
</div>
<div class="sign-trans">没有账号？<a href="javascript:;" class="erphp-reg-must">注册</a> <a href="https://liuguangwu.top/login?action=password&redirect_to=https://liuguangwu.top/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d" rel="nofollow" target="_blank">忘记密码？</a></div>
<div class="sign-social"><h2>社交账号快速登录</h2><a class="login-weixin signmp-loader" href="javascript:;"><i class="icon icon-weixin"></i></a></div> <div class="expend-container">
<a href="javascript:;" title="扫码登录" class="signmp-loader"><svg class="icon toggle" style="width: 4em; height: 4em;vertical-align: middle;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6487"><path d="M540.9 866h59v59h-59v-59zM422.8 423.1V98.4H98.1v324.8h59v59h59v-59h206.7z m-265.7-59V157.4h206.7v206.7H157.1z m0 0M216.2 216.4h88.6V305h-88.6v-88.6zM600 98.4v324.8h324.8V98.4H600z m265.7 265.7H659V157.4h206.7v206.7z m0 0M718.1 216.4h88.6V305h-88.6v-88.6zM216.2 718.3h88.6v88.6h-88.6v-88.6zM98.1 482.2h59v59h-59v-59z m118.1 0h59.1v59h-59.1v-59z m0 0M275.2 600.2H98.1V925h324.8V600.2h-88.6v-59h-59v59z m88.6 59.1V866H157.1V659.3h206.7z m118.1-531.4h59v88.6h-59v-88.6z m0 147.6h59v59h-59v-59zM659 482.2H540.9v-88.6h-59v88.6H334.3v59H600v59h59v-118z m0 118h59.1v59H659v-59z m-177.1 0h59v88.6h-59v-88.6z m0 147.7h59V866h-59V747.9zM600 688.8h59V866h-59V688.8z m177.1-88.6h147.6v59H777.1v-59z m88.6-118h59v59h-59v-59z m-147.6 0h118.1v59H718.1v-59z m0 206.6h59v59h-59v-59z m147.6 59.1h-29.5v59h59v-59h29.5v-59h-59v59z m-147.6 59h59V866h-59v-59.1z m59 59.1h147.6v59H777.1v-59z m0 0" p-id="6488"></path></svg></a>
</div>
</form>
<form id="sign-up" style="display: none;">
<div class="form-item" style="text-align:center"><a href="https://liuguangwu.top"><img class="logo-login" src="https://liuguangwu.top/wp-content/themes/modown/static/img/logo.png" alt="流光坞"></a></div>
<div class="form-item"><input type="text" name="name" class="form-control" id="user_register" placeholder="用户名"><i class="icon icon-user"></i></div>
<div class="form-item"><input type="email" name="email" class="form-control" id="user_email" placeholder="邮箱"><i class="icon icon-mail"></i></div>
<div class="form-item"><input type="password" name="password2" class="form-control" id="user_pass2" placeholder="密码"><i class="icon icon-lock"></i></div>
<div class="form-item">
<input type="text" class="form-control" id="captcha" name="captcha" placeholder="验证码"><span class="captcha-clk">获取验证码</span>
<i class="icon icon-safe"></i>
</div>
<div class="sign-submit">
<input type="button" class="btn signupsubmit-loader" name="submit" value="注册">
<input type="hidden" name="action" value="signup">
</div>
<div class="sign-trans">已有账号？ <a href="javascript:;" class="modown-login-must">登录</a></div>
<div class="sign-social"><h2>社交账号快速登录</h2><a class="login-weixin signmp-loader" href="javascript:;"><i class="icon icon-weixin"></i></a></div> <div class="expend-container">
<a href="javascript:;" title="扫码登录" class="signmp-loader"><svg class="icon toggle" style="width: 4em; height: 4em;vertical-align: middle;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6487"><path d="M540.9 866h59v59h-59v-59zM422.8 423.1V98.4H98.1v324.8h59v59h59v-59h206.7z m-265.7-59V157.4h206.7v206.7H157.1z m0 0M216.2 216.4h88.6V305h-88.6v-88.6zM600 98.4v324.8h324.8V98.4H600z m265.7 265.7H659V157.4h206.7v206.7z m0 0M718.1 216.4h88.6V305h-88.6v-88.6zM216.2 718.3h88.6v88.6h-88.6v-88.6zM98.1 482.2h59v59h-59v-59z m118.1 0h59.1v59h-59.1v-59z m0 0M275.2 600.2H98.1V925h324.8V600.2h-88.6v-59h-59v59z m88.6 59.1V866H157.1V659.3h206.7z m118.1-531.4h59v88.6h-59v-88.6z m0 147.6h59v59h-59v-59zM659 482.2H540.9v-88.6h-59v88.6H334.3v59H600v59h59v-118z m0 118h59.1v59H659v-59z m-177.1 0h59v88.6h-59v-88.6z m0 147.7h59V866h-59V747.9zM600 688.8h59V866h-59V688.8z m177.1-88.6h147.6v59H777.1v-59z m88.6-118h59v59h-59v-59z m-147.6 0h118.1v59H718.1v-59z m0 206.6h59v59h-59v-59z m147.6 59.1h-29.5v59h59v-59h29.5v-59h-59v59z m-147.6 59h59V866h-59v-59.1z m59 59.1h147.6v59H777.1v-59z m0 0" p-id="6488"></path></svg></a>
</div>
</form>
<form id="sign-mp">
<div class="form-item">
<style>
.erphp-weixin-scan{margin:0 auto;position:relative;max-width: 300px;}
.erphp-weixin-scan .ews-title{text-align:center;font-size:18px;}
.erphp-weixin-scan img{max-width: 100%;height: auto;}
.erphp-weixin-scan .ews-box{text-align: center;}
.erphp-weixin-scan .ews-box .ews-input{border:1px solid #eee;border-radius:3px;padding:6px 12px;width:150px;height: 35px;box-sizing: border-box;}
.erphp-weixin-scan .ews-box .ews-button{background: #07C160;border:none;padding:7px 12px;color:#fff;border-radius: 3px;font-size:14px;cursor: pointer;height: 35px;box-sizing: border-box;}
.erphp-weixin-scan .ews-tips{text-align:center;font-size:13px;color:#999;margin-top:10px;}
</style>
<div class="erphp-weixin-scan">
<div class="ews-title">微信扫一扫关注</div>
<img src="http://liuguangwu.top/wp-content/uploads/2025/10/公众号二维码.jpg" />
<div class="ews-box">
<input type="text" id="ews_code" class="ews-input" placeholder="验证码"/>
<button type="button" class="ews-button">验证登录</button>
</div>
<div class="ews-tips">
如已关注，请回复“登录”二字获取验证码
</div>
</div> </div>
<div class="sign-trans" style="text-align:center"><a href="javascript:;" class="modown-login-must">使用其他方式登录/注册</a></div>
<div class="expend-container">
<a href="javascript:;" title="账号登录" class="modown-login-must"><svg class="icon toggle" hidden style="padding:0.5rem;width: 4em; height: 4em;vertical-align: middle;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1166" data-spm-anchor-id="a313x.7781069.0.i0"><path d="M192 960h640v64H192v-64z" p-id="1167"></path><path d="M384 768h256v256H384v-256zM960 0H64a64 64 0 0 0-64 64v640a64 64 0 0 0 64 64h896a64 64 0 0 0 64-64V64a64 64 0 0 0-64-64z m0 704H64V64h896v640z" p-id="1168"></path><path d="M128 128h768v512H128V128z" p-id="1169"></path></svg></a>
</div>
</form>
<div class="sign-notice">登录本站，限时下载所有资源</div>
</div>
</div>
</div>
<script>
window._MBT = {uri: 'https://liuguangwu.top/wp-content/themes/modown', child: 'https://liuguangwu.top/wp-content/themes/modown', urc: '1', uru: '1', url:'https://liuguangwu.top', urg: '1', usr: 'https://liuguangwu.top/user', roll: [], admin_ajax: 'https://liuguangwu.top/wp-admin/admin-ajax.php', erphpdown: 'https://liuguangwu.top/wp-content/plugins/erphpdown/', image: '0.6316', hanimated: '0', fancybox: '0', anchor: '0', loading: '', nav: '0', iframe: '0', video_full: '0',tuan: '0',down_fixed: '0', post_h3_nav: '0'};</script>
<script type="speculationrules">
{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/wp-*.php","\/wp-admin\/*","\/wp-content\/uploads\/*","\/wp-content\/*","\/wp-content\/plugins\/*","\/wp-content\/themes\/modown\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}
</script>
<script>window._ERPHPDOWN = {"uri":"https://liuguangwu.top/wp-content/plugins/erphpdown", "payment": "2", "wppay": "", "tuan":"", "danmu": "0", "author": "mobantu"}</script>
<script type="text/javascript" id="wp-weixin-main-script-js-extra">
/* <![CDATA[ */
var WP_Weixin = {"weixin":{"appid":"wxb9d8a5ef940c5266","nonceStr":"CP9ZV2UxzilTsepK","timestamp":1763420273,"url":"https:\/\/liuguangwu.top\/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d","signature":"112805fb3dd875c19db436ade68b2cf9fc66efbd","rawString":"jsapi_ticket=7mo9kzLF0zXvfXKd2ScDpB-duv3EBZr7zLI0V6YT8W3yCfVsGYztCYFt8sWpB368wMY4rJwanq51wFpS_SbmCw&noncestr=CP9ZV2UxzilTsepK×tamp=1763420273&url=https:\/\/liuguangwu.top\/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d"},"ajax_url":"https:\/\/liuguangwu.top\/wp-admin\/admin-ajax.php","debug":"","share":{"title":"html\u7684\u6807\u7b7e\u7528\u6cd5\u4ecb\u7ecd - \u6d41\u5149\u575e","desc":"","link":"https:\/\/liuguangwu.top\/html%e7%9a%84%e6%a0%87%e7%ad%be%e7%94%a8%e6%b3%95%e4%bb%8b%e7%bb%8d","imgUrl":"https:\/\/wx.qlogo.cn\/mmopen\/JrqVicAaFJGtwxxwqvcysD80THARTQR5LmsL99yJrxklfW30zktUV22EIYaLoaRTKpia5UQkUXNdtg0utWrCHjUJdnzUDRD4XtBluU82S9vnvWiaeYuhD6hsEWS8Yd5le7c\/64"}};
/* ]]> */
</script>
<script type="text/javascript" src="https://liuguangwu.top/wp-content/plugins/wp-weixin/js/main.min.js?ver=1761801764" id="wp-weixin-main-script-js"></script>
<script type="text/javascript" id="wp-statistics-tracker-js-extra">
/* <![CDATA[ */
var WP_Statistics_Tracker_Object = {"requestUrl":"https:\/\/liuguangwu.top\/wp-json\/wp-statistics\/v2","ajaxUrl":"https:\/\/liuguangwu.top\/wp-admin\/admin-ajax.php","hitParams":{"wp_statistics_hit":1,"source_type":"post","source_id":4334,"search_query":"","signature":"ffda537c0dc200a5440dd8b422e50716","endpoint":"hit"},"onlineParams":{"wp_statistics_hit":1,"source_type":"post","source_id":4334,"search_query":"","signature":"ffda537c0dc200a5440dd8b422e50716","endpoint":"online"},"option":{"userOnline":true,"dntEnabled":false,"bypassAdBlockers":false,"consentIntegration":{"name":null,"status":[]},"isPreview":false,"trackAnonymously":false,"isWpConsentApiActive":false,"consentLevel":"functional"},"jsCheckTime":"60000","isLegacyEventLoaded":"","customEventAjaxUrl":"https:\/\/liuguangwu.top\/wp-admin\/admin-ajax.php?action=wp_statistics_custom_event&nonce=b2880adf66"};
/* ]]> */
</script>
<script type="text/javascript" src="https://liuguangwu.top/wp-content/plugins/wp-statistics/assets/js/tracker.js?ver=14.15.5" id="wp-statistics-tracker-js"></script>
<script type="text/javascript" id="ews-js-extra">
/* <![CDATA[ */
var ews_ajax_url = "https:\/\/liuguangwu.top\/wp-admin\/admin-ajax.php";
/* ]]> */
</script>
<script type="text/javascript" src="https://liuguangwu.top/wp-content/plugins/erphp-weixin-scan-master/assets/ews.js?ver=2.01" id="ews-js"></script>
<script type="text/javascript" id="erphpdown-js-extra">
/* <![CDATA[ */
var _ERPHP = {"ajaxurl":"https:\/\/liuguangwu.top\/wp-admin\/admin-ajax.php"};
/* ]]> */
</script>
<script type="text/javascript" src="https://liuguangwu.top/wp-content/plugins/erphpdown/static/erphpdown.js?ver=18.22" id="erphpdown-js"></script>
<script type="text/javascript" src="https://liuguangwu.top/wp-content/themes/modown/static/js/lib.js?ver=9.71" id="modown-lib-js"></script>
<script type="text/javascript" src="https://liuguangwu.top/wp-content/themes/modown/static/js/fancybox.min.js?ver=3.3.5" id="modown-fancybox-js"></script>
<script type="text/javascript" src="https://liuguangwu.top/wp-content/themes/modown/static/js/base.js?ver=9.71" id="modown-base-js"></script>
<script>MOBANTU.init({ias: 0, lazy: 1, plazy: 0, water: 0, mbf: 0, mpf: 1, mpfp: 0});</script>
<meta name="google-site-verification" content="cgLkmPjmP_Vor3ZyV-ZB-mWRLocB_EtHNZm-zEs2juI" /><div class="analysis"></div>
</body></html>
* **开始标签**：如 `
`，表示元素的开始。
* **内容**：标签之间的部分，如文本、图片等。
* **结束标签**：如 `
`，在元素名前面有一个斜杠 `/`，表示元素的结束。
一个完整的HTML元素结构如下：
```html
这是一个段落。
```
有些标签是**自闭合标签**，它们没有结束标签，因为不包含内容。例如用于插入图片的 `` 标签和用于换行的 `
` 标签。
```html
```
#### **二、HTML标签的基本结构**
一个标准的HTML文档，是由一系列特定标签构成的框架。让我们从一个最简单的HTML5文档开始：
```html
欢迎来到我的网站
这是段落内容。
```
让我们逐一拆解这些核心标签的用法：
1. **``**：**文档类型声明**，告诉浏览器这是一个HTML5文档，必须位于文档最前面。
2. **``**：**根元素**，包裹整个HTML页面的所有内容。`lang` 属性用于声明网页的主要语言。
3. **`
* ``：定义文档使用UTF-8字符编码，确保中文等字符正确显示。
* `