`

表格样式的应用——对程序员比较有用(一)

阅读更多
table 所有的HTML Tag
<table>
  <tbody>
   <caption>table caption</caption>
   <colgroup>
      <col />
      <col />		   
   </colgroup>
   <tr>
      <th>Food</th>
      <th>Drink</th>
      <th>Sweet</th>
   </tr>
   <tr>
      <td>A</td>
      <td>B</td>
      <td>C</td>  
   </tr> 
  </tbody>   
</table>



table 所有的CSS Properties
table{
   border-collapse:separate | collapse;
   border-spacing : length | length;
   caption-side : bottom | left |right | top;
   empty-cells : hide | show;
   table-layout : auto | fixed;
}

border-collapse : separate | collapse

参数:
separate :  边框独立(标准HTML)
rtl :  相邻边被合并

说明:
设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开。

border-spacing : length || length

参数:
length :  由浮点数字和单位标识符组成的长度值。不可为负值。请参阅长度单位

说明:
设置或检索当表格边框独立(例如当border-collapse属性等于separate时),行和单元格的边框在横向和纵向上的间距。

caption-side : bottom | left |right | top

参数:
bottom :  下面
left :  左边
right :  右边
top :  下面

说明:
设置或检索表格的caption对象是在表格的那一边。它是和caption对象一起使用的属性。

empty-cells : hide | show

参数: 
hide :  隐藏
show :  显示

说明:
设置或检索当表格的单元格无内容时,是否显示该单元格的边框。
只有当表格边框独立(例如当border-collapse属性等于separate时)此属性才起作用。

table-layout : auto | fixed

参数:
auto :  默认的自动算法。布局将基于各单元格的内容。表格在每一单元格读取计算之后才会显示出来。速度很慢
fixed :  固定布局的算法。在这算法中,水平布局是仅仅基于表格的宽度,表格边框的宽度,单元格间距,列的宽度,而和表格内容无关

说明:
设置或检索表格的布局算法。
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics