table-表格 自己遇见的问题总结

1、<table border="1" cellpadding="0" cellspacing="0"></table>，单元格的边距（cellpadding），单元格间的距离(cellspacing)，当他们两个都设置为0时，表格之间没有任何间距，例如

 

2、折叠边框：border-collapse:collapse;

3、合并行使用：colspan=“”； 合并列使用：rowspan=“”

4、表格对齐

单元格的对齐（align）：left、right、center;

表格的水平对齐：

text-align 属性设置 <th> 或 <td> 中内容的水平对齐方式（左、右或居中），默认情况下，<th> 元素的内容居中对齐，而 <td> 元素的内容左对齐。如果想让<td>元素居中对齐请使用text-align:center;

表格的垂直居中：

vertical-align 属性设置 <th> 或 <td> 中内容的垂直对齐方式（上、下或居中）。

默认情况下，表中内容的垂直对齐是居中（<th> 和 <td> 元素都是）。

5、添加背景色使用：bgcolor ，添加背景图片使用：backgroun

6、表格的边框是圆角时：border-collapse: separate;

7、当表格想铺满整个屏幕的时候，table应该设置成：<table width="100%></table>或在css里写样式。

8、条纹表格：

请使用 nth-child() 选择器，并为所有偶数（或奇数）表行添加 background-color：，nth-child(even) 是偶数，nth-child(odd)是奇数。

9、规定表格标题的放置方式：所有主流浏览器都支持caption-side属性，例如：Chrome，Firefox，Safari，Opera，Internet Explorer 8+以及Android和iOS

caption
  {
  caption-side:bottom/top/inherit(从父级继承caption-side 属性的值);
  }

caption-side:top

 caption-side:bottom