码迷,mamicode.com
首页 > Web开发 > 详细

HTML语义化标签

时间:2015-12-18 09:06:40      阅读:116      评论:0      收藏:0      [点我收藏+]

标签:

 总所周知,现在的网页是由HTML、CSS、JS三大元素组成,而HTML是其中最重要的部分,是整个网页的骨架,CSS和js在骨架的基础上进行相应的修饰,使得网页成为一个有血有肉,可以动的“人”。如果HTML设计不合理,则类似一个骨骼不健全的人,即使外表再怎么修饰,也掩盖不了他明显的缺陷。

    HTML标签都是带有语义考虑的,例如table语义为“表格”、tr为“单元行”、td为“单元格”。判断一个网页标签语义是否良好的一个简单方位就是:“去掉样式,看网页结构是否良好有序,是否任然具有很好的可读性”。一个语义良好的页面,h标签应该是完整有序没有断层的,按照h1、h2、h3、h4这样依次排列下来。在工作中可以使用web Developer或者firebug进行查看。W3C的官方网站就是一个典型的语义良好的标榜,http://www.w3.org/。

   以下是去掉样式的W3C的官网

  

为了保证网页去样式后的可读性,并且又符合web标准,应该注意一下几点:

     1  尽可能少的使用无语义的标签div和span;

     2  在语义不明显时,既可以使用div或者p时,尽量用p, 因为p在默认情况下有上下间距,对兼容特殊终端有利;

     3  不要使用纯样式标签,如:b、font、u等,改用css设置。

     4  需要强调的文本,可以包含在strong或者em标签中,strong默认样式是加粗,而em是斜体;

     5  使用表格时,标题要用caption,表头用thead,主体部分用tbody包围,尾部用tfoot包围。表头和一般单元格要区分开,表头用th,单元格用td;

     6  表单域要用fieldset标签包起来,并用legend标签说明表单的用途;

     7  每个input标签对应的说明文本都需要使用label标签,并且通过为input设置id属性,在lable标签中设置for=someld来让说明文本和相对应的input关联起来;

  

HTML语义化标签

标签:

原文地址:http://www.cnblogs.com/shouce/p/5056005.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!