一：(理论)语义化标签是什么？
语义化标签就是尽量使用有相对应的结构的含义的Html的标签，以Table为例：
你看出了上面的Table有什么毛病吗？嘿嘿，那你看这个语义化的标签
这两块代码的标签不一样，第二个表格的这些标签代码，无疑更符合Web标准.
:表格的标题;
:一表格的表头;
:表的某一列的列头。
再说我们习以为常的
博客园简介博客园是一个软件开发的技术乐园，它于2004年创办，这里...
你看，为什么我们看一篇文章，一下就知道标题在哪呢？在浏览器的顶端。那为什么搜索引擎能抓取呢？就是它知道这个语义化标签里的就是文章标题，要是我们不遵守这个，而是：<br><span>博客园简介</span><span>博客园是一个软件开发的技术乐园，它于2004年创办，这里...<span><br> 那搜索引擎怎么就知道谁是标题，谁是内容了呢？它又靠什么去抓取标题呢?其实语义化不仅可以是标签语义化,还可以延伸成结构语义化.举例:<br>#left{float:left;margging-left:50px;}<br> <br>#right{float:right;margin-top:100px;}<br> <br><div id="left">content..</div><br> <br><div id="right">content..</div><br> 这个例子里对id的命名稍微有点夸张,但是类似的情况却使有的,当我们想把#left这个div放到页面的右边,和#right调换位置时,难道你可以把样式改成这样?<br>#left{float:right;margin-left:50px;}<br> <br>#right{float:left;margin-top:100px;}<br> 那样看着多别扭,多误导人这两个div的布局啊.<br>应该写成这样.<br><div id="main">content..</div><br> <br><div id="sidebar">content..</div><br> 那样既一目了然这几个div里是什么内容也方便对其中的样式进行修改.<br><br>二：(理论)语义化标签怎么样？<br>1.结构更好，更利于搜索引擎的抓取（SEO的优化）和开发人员的维护(可维护性更高，因为结构清晰,so易于阅读)。 <br>2.更有利于特殊终端的阅读(手机，个人助理等）。 <br><br>三：(行动)语义化标签怎么办？<br>尽量用有结构含义的,少用无语义的，如<span>,<div>无意义，看不出是什么东西,可是<address>一看就知道这里面的是地址,em标签一看就知道这个是强调的内容,区分于不同内容。<br><br>那么，怎么判断你的页面是否符合Web标准之一：语义化标签呢？你可以把你的页面暂时去掉样式后看可读性怎么样，如果这个时候感觉你的页面很乱，那就说明的的页面的语义化标签不怎么样，而如果你的页面去掉样式了感觉依然不是杂乱无章的，那么，就说明你的页面结构清晰，语义化标签比较可以了。</p>
</div>
</div>
<div class="clear"></div>
</div>
<div class="wdhdnr">
<div class="huidanrtop">
<div class="wdhuidaxinx">
<div class="wdhuidaxm">回答3：</div>
</div>
</div>
<div class="clear"></div>
<div class="wdhuidanrmid">
<div class="zuijiacont">
<p><p> html5语义化标签有这些及其作用 - https://21xrx.com/full_stack/Html/html5_semantics.html</p></p>
</div>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<div class="wendaright">
<div class="wdluluerwema">
<div class="wdxgwttop">相关问答</div>
<div class="wdxgwtnr">
</div>
<div class="clear"></div>
</div>
<!-- 其他随机问答['id'=>alphaID($like['zid'])] -->
<div class="wdluluerwema">
<div class="wdxgwttop">最新问答</div>
<div class="wdxgwtnr">
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/1239596194454354339.html">食品净化车间提供给组合式空调机组做热源的蒸汽是饱和蒸汽还是过热蒸汽</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/538271711.html">什么是记帐基础及计价原则</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/489171411023040852.html">才发现我无法面对你，曾经对爱的憧憬，拼了命去爱你，这首歌名叫什么？</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/31099431.html">显示器显示超出频率范围,就无法进入系统???</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/179626044.html">WPS中怎么输入高次幂</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/51091278.html">如何从电脑中彻底删除office2003？因提示系统中的office有漏洞，系统C盘中MSOHEV.DLL的一个文件无法删除</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/171515338.html">急急急急急想写一份还款书，请律师朋友帮帮忙！</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/1496477164500162659.html">广州哪些酒楼或者饭店适合商务宴请</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/1863709641707245467.html">本人是三本电气工程及其自动化的学生，想考研考电力系统及其自动化的。推荐一下有这个专业的硕士点好考一</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/11983167.html">台风,热带风暴与热带气旋三者有什么区别?</a></div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="footer">
<!-- 移动底部导航 -->
<div class="fanhuitop"><a href="#top" ref="nofollow"><img src="https://aq8.net/static/old/img/fhtop.png" alt="返回顶部" title="返回顶部"></a></div>
<div class="dibu">
<div class="dibu">
</div>
</div>
<div class="banquan">
<p>内容全部来源于网络收集，如有侵权，请联系网站删除：QQ：24596024</p>
</div>
</div>
</div>
</div>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?d86df1760ee607dc5bff1a7aab937e8e";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</body>
</html>
| 