1. 程式人生 > >table表格做一個表頭斜線樣式

table表格做一個表頭斜線樣式

* { margin: 0; padding: 0; } table { border: 1px solid #fff; /*去掉表格之間的空隙*/ border-collapse:collapse; margin: 100px auto; } caption { font-size: 20px; font-weight: bold;
} th,td{ border: 1px solid #ccc; width: 80px; font-size: 14px; line-height: 40px; text-align: center; } /*模擬對角線*/ .out{ border-top:40px #D6D3D6 solid;/*上邊框寬度等於表格第一行行高*/ width:0px;/*讓容器寬度為0*/
height:0px;/*讓容器高度為0*/ border-left:80px #BDBABD solid;/*左邊框寬度等於表格第一行第一格寬度*/ position:relative;/*讓裡面的兩個子容器絕對定位*/ } b{ font-style:normal; display:block; position:absolute; top:-40px; left:-40px; width
:50px; } em{ font-style:normal; display:block; position:absolute; top:-25px; left:-70px; width:55px; }