《编写高质量代码》笔记--语义化的表格 

 1 <table border="1">
 2     <caption>几种页面实现的比较</caption><!--表格标题-->
 3     <thead><!--表格头部-->
 4         <tr>
 5             <th>实现方式</th><!--表头-->
 6             <th>代码量</th>
 7             <th>搜索引擎友好</th>
 8             <th>特殊终端兼容</th>
 9         </tr>
10     </thead>
11     <tbody><!--表格主体部分-->
12         <tr>
13             <th>table布局</th><!--单元格-->
14             <th>多</th>
15             <th>差</th>
16             <th>一般</th>
17         </tr>
18         <tr>
19             <th>乱用标签的CSS布局</th>
20             <th>少</th>
21             <th>一般</th>
22             <th>差</th>
23         </tr>
24         <tr>
25             <th>语义良好的CSS布局</th>
26             <th>少</th>
27             <th>好</th>
28             <th>好</th>
29         </tr>
30     </tbody>
31     <tfoot><!--表格尾部-->
32     </tfoot>
33 </table>

效果:

几种页面实现的比较
实现方式代码量搜索引擎友好特殊终端兼容
table布局多差一般
乱用标签的CSS布局少一般差
语义良好的CSS布局少好好
posted @ 2014-12-03 00:25  Yanyd  阅读(117)  评论(0)    收藏  举报