table表格的总结

/*表格样式*/
.table {
        color:#555;
        font-size: 14px;
        border-collapse: collapse;//单元格间没有间距
        border:1px solid #e6e6e6;
}
.table caption{
        font: bold 18px/2em "微软雅黑";
}
.thead{
        line-height: 40px;
        background:#f4f4f4; 
}
.table input[type="checkbox"]{
        margin:0 5px 0 0;
        vertical-align: middle;
        margin-top:-4px;
        *margin-top:-2px;
}
.table td{
        padding:7px 5px; 
        border:1px solid #e6e6e6;
}
除火狐与360极速浏览器外，其它浏览器设置table的边框颜色，均不能影响td的边框
ie7下，table的边框不会被th，td的边框颜色覆盖

表格设置宽度后，大多会自动换行，
但加入white-space: nowrap;让表格内容过多实现省略号的样式，会出发表格默认的table-layout:auto;样式，会超出表格，需要加上table-layoue:fixed;
.table{
        table-layout:fixed;
}
.table td{
        white-space: nowrap;  
        overflow: hidden;
        text-overflow: ellipsis;
}

border-spacing:0;其作用等同于标签属性cellspacing(单元格边距)。border-spacing:0等同于cellspacing="0"
只有当表格边框独立（即border-collapse：separate时）此属性才起作用。
如果提供全部两个length值时，第一个作用于横向间距，第二个作用于纵向间距。
所以将table设置为border-collapse: collapse;后，无需加border-spacing:0;
我们可以利用这一属性为单元格里的内容增加间距，并且不会增加table的宽度，与padding不同，但可惜的是ie7不支持

th默认文本加粗,默认居中
td默认局左


html




     
        
        
        
        
        
        
      


  
   
   
   
   
   
   
  
  
   
   
   
   
   
   
  
  
   
   
   
   
   
   
  
  
   
   
   
   
   
   
  
  
   
   
   
   
   
   
  

表格标题

类名	类名	类名	类名	类名	类名
1	二维码	二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码	二维码	2012-12-13	二维码
2	二维码	二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码	二维码	2012-12-13	二维码
3	二维码	二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码	二维码	2012-12-13	二维码
4	二维码	二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码	二维码	2012-12-13	二维码
5	二维码	二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码二维码	二维码	2012-12-13	二维码