时间:2014-01-29所属栏目: Html+css 来源: 热度:
使用table制作表格确实方便,但使用ul,li制作表格也并非一件难事。下面分享一下我平常使用ul,li制作表格的方法。
CSS:
/*清除浮动*/
.table ul:before, .table ul:after{content:"";display:table;}
.table ul:after{clear:both;}
.table ul{zoom: 1;}
.table ul{border:#ccc solid;}
.table ul.table-header{border-width:1px 1px 1px 0;background:#f8f8f8;}
.table ul.table-item{border-width:0 1px 1px 0;}
.table li{float:left;text-align:center;}
.table li div{border-left:1px solid #ccc;height:24px;line-height:24px;}
.table li.td-1{width:10%;}
.table li.td-2{width:30%;}
.table li.td-3{width:20%;}
.table li.td-4{width:40%;*width:39%;/*针对IE6/7*