CSS美化table表格样式

table的html构造:
一个基本的table的构造形式:

  1. <table>
  2. <tr><th>姓名</th><th>学号</th><th>注册时间</th><th>备注</th></tr>
  3. <tr><td>LeeYea</td><td>20140007</td><td>15:212014/10/27</td><td>欢迎加入久久经验网</td></tr>
  4. <tr><td>Mike</td><td>20140007</td><td>15:282014/10/27</td><td>欢迎加入久久经验网</td></tr>
  5. <tr><td>ChaLi</td><td>20140007</td><td>15:512014/10/27</td><td>欢迎加入久久经验网</td></tr>
  6. </table>
【CSS美化table表格样式】table的th标签一般用于制作表头的单元格,默认水平居中 。
测试通过浏览器刷新后可以看到一个table,当然,此时的table奇丑无比!
css美化table:
  1. table{border-collapse:collapse}/*合并间距*/
  2. table,tableth,tabletd{border:1pxsolid#ddd}/*表格带线框,6像素的间距*/
  3. tableth,tabletd{padding:6px}/*单元格6像素的间距*/
  4. tableth{background-color:#eee}/*表头带背景色*/
当然,等以后学习了更多的css知识之后,我们可让表格更具特色 。

    秒懂生活扩展阅读