一：(理论)语义化标签是什么？
语义化标签就是尽量使用有相对应的结构的含义的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/index.php/591053494911350365.html">今天孩子去上课，检查视力，结果发现100度近视，需要配眼镜嘛？</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/1577460020323830340.html">巴黎欧莱雅玻尿酸和兰芝化妆品哪个用起来效果好</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/564421193.html">百度手机助手可以自动下载应用吗？</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/1052934410151639539.html">上海凯斯汽车用品市场经营管理有限公司怎么样？</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/697085605308934164.html">专升本英语翻译题大全</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/503561593093105564.html">我的卡巴斯基激活码上次的时候还能用，这次一输上激活码怎么就说激活码错误呢？为什么？</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/1446143626157291460.html">想知道:绍兴市 从上虞老大通到龙山生态公园怎么坐公交？</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/558805431.html">报到证怎么使用，有报到证但是不报到有什么后果</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/284126241.html">西南科技大学土木工程与建筑学院分数线</a></div>
</div>
<div class="wdxgwtcont">
<div class="wdxgtitle"><a href="https://aq8.net/index.php/1548479596571189027.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>
| 