20.2 HTML常用标签
HTML（HyperText Markup Language）是构建网页的基础语言，它通过一系列的标签来描述网页的结构和内容。在“20.2 HTML常用标签”这个主题中，我们将深入探讨一些HTML中不可或缺的核心标签，这些标签对于创建功能性且结构清晰的网页至关重要。 1. **文档类型声明（）**：这是每个HTML文档的开头，用于告知浏览器文档遵循的HTML版本。在HTML5中，通常使用``简洁声明。 2. **HTML根元素（）**：整个HTML文档的父级元素，包含文档的所有内容。 3. **头部元素（）**：用于定义文档的元数据，如字符编码（）、页面标题（）以及引用外部样式表（<link rel="stylesheet" href="...">）等。 4. **主体元素（<body>）**：页面的主要内容都在这个标签内，包括文本、图像、链接、表格等。 5. **标题标签（<h2> - <h7>）**：用于设置不同级别的标题，其中<h2>是最高级别，<h7>是最小级别。 6. **段落标签（<p>）**：用于表示一段文字，每个段落之间会自动添加间距。 7. **换行标签（<br>）**：用于在文本中插入一个单独的换行。 8. **链接标签（<a target='_blank' href="image.jpg" data-fancybox="gallery"><img>）**：插入图片，src属性指定图片源，alt属性提供替代文本，如`<img src="image.jpg" alt="描述性文本"></a>`。 10. **无序列表（<ul>）**与有序列表（<ol>）：<ul>用于创建不带顺序的列表，<ol>用于创建带数字或字母顺序的列表，两者内部都使用<li>标签定义列表项。 11. **定义列表（<dl>）**：用于展示术语及其定义，包含<dt>（定义术语）和<dd>（定义描述）两个子标签。 12. **区块元素与内联元素**：如<div>（定义文档中的分区）、<span>（用于组合部分文本或元素），前者是块级元素，独占一行，后者是内联元素，与其他内联元素共享一行。 13. **表格元素（<table>）**：用于创建表格，包含<thead>（表头）、<tbody>（表体）、<tr>（行）、<th>（表头单元格）、<td>（数据单元格）等。 14. **表单元素（<form>）**：用于创建用户交互的表单，包含<input>（输入框）、<select>（下拉列表）、<textarea>（多行文本输入）、<button>（按钮）等。 15. **CSS样式控制**：虽然不是HTML标签，但通过<style>元素或外部样式表，可以对HTML元素的样式进行定义，如颜色、字体、布局等。了解并熟练掌握这些常用的HTML标签是构建网页的基本功。通过合理地组织和使用它们，我们可以构建出丰富多样的网页内容，为用户提供良好的浏览体验。在实际工作中，还会遇到更多的HTML标签和属性，持续学习和实践是不断提升HTML技能的关键。 </div>
</di>
<div class="article" style="margin-top:0px;margin-bottom: 15px;">
<div >
<div class="col-xs-4 col-sm-4">
<a class="views-num" href="#download" title="20.2 HTML常用标签下载地址">下载地址</a>
</div>
<div class="col-xs-4 col-sm-4">
<a href="#pinglun" title="20.2 HTML常用标签怎么样">用户评论</a>
</div>
<div class="col-xs-4 col-sm-4">
<a href="#gdownload" title="更多和20.2 HTML常用标签相关的下载">更多下载</a>
</div>
</div>
</div>
</div>
</div>
</article>
<div class="panel-group">
<div class="panel panel-default" id="download">
<div class="panel-heading">
<div class="panel-title">
<span>下载地址</span>
</div>
</div>
<div class="row">
<div class="panel-body">
<div class="col-xs-3 cursors" >
<a href="" target="_blank" class="downloadbtn"></a>
<a id="downloadbtn" data-id="8508671" class="cursors btn btn-danger"><i class="iconfont icon-xiazai" aria-hidden="true"></i> 立即下载</a>
</div>
<!-- <div class="col-xs-9 text-right" >
<a class="small-btn collect-btn"><i class="fa fa-star-o" aria-hidden="true"></i><span>收藏</span></a>
<a class="small-btn collect-btn"><i class="fa fa-qq" aria-hidden="true"></i><span>腾讯</span></a>
<a class="small-btn collect-btn"><i class="fa fa-weibo" aria-hidden="true"></i></i><span>微博</span></a>
</div>-->
</div>
</div>
</div>
</div>
<div class="panel-group" >
<div class="panel panel-default" id="pinglun">
<div class="panel-heading">
<div class="panel-title">
<span>用户评论</span>
</div>
</div>
<div class="row">
<div class="panel-body">
<div id="comment-container">
<!-- S 评论列表 -->
<div id="commentlist">
<!-- <div class="text-center"><span class="loadmore-tips">暂无评论</span></div>
-->
</div>
<!-- E 评论列表 -->
<!-- S 评论分页 -->
<div id="commentpager" class="text-center">
</div>
<!-- E 评论分页 -->
<!-- S 发表评论 -->
<div class="mt-3">
<form action="/api/Frontend/comment" method="post" id="commentpostform">
<input type="hidden" name="type" value="archives"/>
<input type="hidden" name="aid" value="8508671"/>
<input type="hidden" name="pid" id="pid" value="0"/>
<div class="input-group">
<input name="content" class="form-control"
disabled placeholder="下载后再发表评论"
id="commentcontent" cols="6" rows="5" tabindex="4">
<span class="input-group-btn">
<a id="submit" class="btn btn-dangers btn-sm" disabled
type="button">发表评论</a>
</span>
</div>
</form>
</div>
<!-- E 发表评论 -->
</div>
</div>
</div>
</div>
</div>
<div class="panel-group" >
<div class="pl-0 pr-0 " >
<div class="panel-body _downbdad"></div>
</div>
</div>
<aside>
<ul class="panel-body pl-0 pr-0" id="gdownload">
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/8508671.html" title="20.2 HTML常用标签"><span><em class='text-danger fst-normal'>20.2</em> <em class='text-danger fst-normal'>HTML</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em></span></a>
</div>
<p class="list-descri">
HTML（HyperText Markup Language）是构建网页的基础语言，它通过一系列的标... </p>
<div class="list-ifon">
大小：677.73KB | 2024-07-05 04:05:07 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/201036.html" title="html标签大全常用html标签"><span><em class='text-danger fst-normal'>html</em><em class='text-danger fst-normal'>标签</em>大全<em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>html</em><em class='text-danger fst-normal'>标签</em></span></a>
</div>
<p class="list-descri">
html标签大全，常用html标签。便于初学者查阅~ </p>
<div class="list-ifon">
大小：0B | 2018-12-15 10:10:24 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/4141475.html" title="HTML常用标签"><span><em class='text-danger fst-normal'>HTML</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em></span></a>
</div>
<p class="list-descri">
HTML常用标签，在实际中如何运用，虽然很多标签都能达到一行的效果，但是其本身的标签更具有体现性。 </p>
<div class="list-ifon">
大小：0B | 2019-09-20 19:56:09 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/3468100.html" title="HTMl常用标签"><span><em class='text-danger fst-normal'>HTMl</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em></span></a>
</div>
<p class="list-descri">
各种javaweb标签开发各种程序更加方便 </p>
<div class="list-ifon">
大小：0B | 2019-07-13 18:25:55 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/740455.html" title="html常用标签"><span><em class='text-danger fst-normal'>html</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em></span></a>
</div>
<p class="list-descri">
</p>
<div class="list-ifon">
大小：0B | 2019-01-07 20:36:05 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/3264767.html" title="html教程常用标签"><span><em class='text-danger fst-normal'>html</em>教程<em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em></span></a>
</div>
<p class="list-descri">
Html tutorial, common tags </p>
<div class="list-ifon">
大小：0B | 2019-06-27 23:59:50 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/3129316.html" title="HTML常用标签说明"><span><em class='text-danger fst-normal'>HTML</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>说明</span></a>
</div>
<p class="list-descri">
HTML common label description </p>
<div class="list-ifon">
大小：0B | 2019-06-22 14:26:54 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/3129321.html" title="html常用标签说明"><span><em class='text-danger fst-normal'>html</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>说明</span></a>
</div>
<p class="list-descri">
Html common label description </p>
<div class="list-ifon">
大小：0B | 2019-06-22 14:27:07 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/778769.html" title="Html常用标签元素"><span><em class='text-danger fst-normal'>Html</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>元素</span></a>
</div>
<p class="list-descri">
</p>
<div class="list-ifon">
大小：0B | 2019-01-09 00:38:56 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/3802158.html" title="HTML常用标签.xlsx"><span><em class='text-danger fst-normal'>HTML</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>.xlsx</span></a>
</div>
<p class="list-descri">
包含了HTML中最常用的标签，讲解详细，适合用作查阅手册 </p>
<div class="list-ifon">
大小：0B | 2019-08-02 06:49:38 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/5841290.html" title="HTML常用标签资源"><span><em class='text-danger fst-normal'>HTML</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>资源</span></a>
</div>
<p class="list-descri">
提供了HTML常用的标签。在页面中都是常用的。对初学者提供很大帮助。资源共享共同进步。 </p>
<div class="list-ifon">
大小：28KB | 2020-08-20 06:28:41 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/264227.html" title="HTML常用标签总结"><span><em class='text-danger fst-normal'>HTML</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>总结</span></a>
</div>
<p class="list-descri">
经过一段时间的学习，对于HTML也有了基础的认识。所以我就一点点的总结一下各类常用的标签的用法。 </p>
<div class="list-ifon">
大小：0B | 2018-12-20 04:46:53 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/3129326.html" title="html css常用标签"><span><em class='text-danger fst-normal'>html</em> css<em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em></span></a>
</div>
<p class="list-descri">
Html, css common tags </p>
<div class="list-ifon">
大小：0B | 2019-06-22 14:27:27 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/6250633.html" title="HTML常用标签大全及html标签的特点"><span><em class='text-danger fst-normal'>HTML</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>大全及<em class='text-danger fst-normal'>html</em><em class='text-danger fst-normal'>标签</em>的特点</span></a>
</div>
<p class="list-descri">
本篇文章给大家整理些关于html常用标签大全及html标签的特点,希望对大家学习html相关知识有所... </p>
<div class="list-ifon">
大小：71KB | 2020-10-03 01:09:47 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/5837850.html" title="html常用标签解释大全"><span><em class='text-danger fst-normal'>html</em><em class='text-danger fst-normal'>常用</em><em class='text-danger fst-normal'>标签</em>解释大全</span></a>
</div>
<p class="list-descri">
在Web开发时,一些前台工作要用到的基本的前台html页面标签,不是特别详细,但是对于Web开发够用... </p>
<div class="list-ifon">
大小：53KB | 2020-08-20 04:16:44 </div>
</article>
</li>
<li class=" article-section article-item mb-1">
<article>
<div class="list-title htmer">
<a target="_blank" href="/q/a/441562.html" title="html所有标签常用属性"><span><em class='text-danger fst-normal'>html</em>所有<em class='text-danger fst-normal'>标签</em><em class='text-danger fst-normal'>常用</em>属性</span></a>
</div>
<p class="list-descri">
HTML一些常用属性总结，实用，适合初学html者 </p>
<div class="list-ifon">
大小：0B | 2018-12-28 08:09:49 </div>
</article>
</li>
</ul>
</aside>
</main>
<div class="article-sidebar col-md-4">
<div class="panel panel-default hot-article">
<div class="panel-body ">
<div id="cao_widget_userinfo-2" class="widget widget-userinfo">
<div class="author-card_content">
<div class="author_avatar">
<div class="col-auto">
<img alt="" data-src="/assets/img/avatar.png" class="avatar avatar-96 photo qq img-circle" width="50" src="/assets/img/avatar.png">
</div>
<div class="col n2">
<a href="/u/2761338.html" target="_blank">procession4315</a>
<small class="d-block">资源：11 粉丝：0</small>
</div>
<div class="col-auto">
<a href="javascript:;" class="btn btn-danger btn-sm click-follow" data-authorid="2761338" data-status="0">+关注</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4 mb-2" style="height: 45px">
<a target="_blank" href="/index/user/uploadfile" class="col-xs-12 btn btn-danger btn-lg"><i class="iconfont icon-shangchuan" aria-hidden="true"></i> 上传资源</a>
</div>
<div class="col-md-4 article-sidebar">
<div class="panel panel-default hot-article">
<div class="panel-body _aboutdownload"></div>
</div>
</div>
<div class="col-md-4 article-sidebar">
<div class="panel panel-default hot-article">
<div class="panel-heading">
<span class="panel-title">免责说明</span>
</div>
<div class="panel-body">
<div class="panel-body">
本站只是提供一个交换下载平台，下载的内容为本站的会员网络搜集上传分享交流使用,有完整的也有可能只有一分部,相关内容的使用请自行研究,主要是提供下载学习交流使用,一般不免费提供其它各种相关服务! 本站内容泄及的知识面非常广,请自行学习掌握,尽量自已动脑动手解决问题,实践是提高本领的途径,下载内容不代表本站的观点或立场!如本站不慎侵犯你的权益请联系我们,我们将马上处理撤下所有相关内容！联系邮箱：server@dude6.com
</div>
</div>
</div>
</div>
</div>
</div>
<div id="opendown" class="opendown" style="display: none"></div>
<div id="paydown" class="opendown" style="display: none"></div>
<script>var downid = 8508671</script>
<footer class="footer" style="clear:both">
<p class="copyright">
Copyright © 2017-2020 qcsdn.cn All Rights Reserved 码姐姐 版权所有 <a href="https://beian.miit.gov.cn/" target="_blank">粤ICP备16081799号</a> | <a href="http://qcsdn.com/sitemap.xml">网站地图</a>
</p>
</script></footer>
<div id="floatbtn">
<a id="fb-tipoff" class="hover" href="http://www.qcsdn.cn/index/user/uploadfile" target="_blank">
<i class="iconfont icon-shangchuan" aria-hidden="true"></i>
</a>
<div id="share"></div>
<a id="feedback" class="hover" href="#pinglun">
<i class="iconfont icon-pinglun" aria-hidden="true"></i>
</a>
<a id="back-to-top" class="hover" href="javascript:;" style="display: none">
<i class="iconfont icon-jiantoushang" aria-hidden="true"></i>
</a>
</div>
<script type="text/javascript" src="/assets/libs/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="/assets/js/publicejs.js?v=2.0.4.23"></script>
<script type="text/javascript" src="/assets/js/common.js?v=2.0.4.23"></script>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?749301c3e053cc620e6b0d1682744892";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script type="text/javascript">
(window.slotbydup = window.slotbydup || []).push({
id: "u6566807",
container: "_downbdad",
async: true
});
(window.slotbydup = window.slotbydup || []).push({
id: "u6889993",
container: "_aboutdownload",
async: true
});
$('#share').share({sites: ['qzone', 'qq', 'weibo','wechat']});
</script>
<script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js" async="async" defer="defer" ></script>
</body>
</html>