表格布局规范

一、在写<table>互相嵌套时,对于单独的一个<table>来说,<table><tr>对齐,<td>缩进一个tab;<td>中如果还有嵌套的表格,<table>也缩进一个tab;如果<td>中没有任何嵌套的表格,</td>结束标记应该与<td>处于同一行,不要换行。

源代码不应有这样的代码:

<td><img src="../images/sample.gif">
</td>

而应该这样写:

<td><img src="../images/sample.gif"></td>

这是因为,游览器认为,换行相当于一个半角空格,以上不规范的写法相当于无意中增加了一个半角空格。

如果确实有必要增加一个半角空格,也应该这样写:

<td><img src="../images/sample.gif"> </td>

二、属于同一个级别的<table>一定是左首对齐的,另外不允许没有任何内容的空的单元格存在,空单元格高度采用<td></td>插入一个1*1大小的透明gif图片(通常为null.fig),这是因为,某些浏览器认为空半桥单元格非法而不予以解释。

三、Width和Height的写法也有统一规范,一般情况下只有一列的表格,width写在<table>标签里,只有一行的表格,height写在<table>标签里,多行多列的表格,width和height写在第一行或者第一列的<td>标签里。

总之,遵循一条原则:不出现多于一个的控制同一个单元格大小的height和width,保证任何一个height和width都有效,也就是改动代码中任何一个height和width的数值,都庆浏览器中看到变化。

 

参考网址:

http://blog.csdn.net/m13666368773/article/details/8020928 

posted on 2011-10-29 06:37  WestGarden  阅读(306)  评论(0编辑  收藏  举报

导航