僅供新手參考學習,歡迎大家提出更多的實作方法。 類比表格對角線 <br/>*{padding:0;margin:0;} caption{font-size:14px;font-weight:bold;} <br/>table { border-collapse:collapse;border:1px #525152 solid;width:50%;margin:0 auto;margin-top:100px;} <br/>th,td{border:1px #525152 solid;textfont-align:centertd{border:1px #525152 solid;textfont-align:center; -size:12px;line-height:30px;background:#C6C7C6;} <br/>th{background:#D6D3D6;} /*模擬對角線*/<br/>.out{ border-top:40px #D6D3D6 solid;/*上邊框寬度等於表格第一行高*/<br/>width:0px;/*讓容器寬度為0*/ <br/>height:0px;/*讓容器高度為0*/ <br/>border-left:80px #BDBABDsolid;/BDBABDsolid;/BDBA *左邊框寬度等於表格第一行第一格寬度*/ <br/>position:relative;/*讓裡面的兩個子容器絕對定位*/ } <br/>b{font-style:normal;display:block;position:absolute; top:-40px;left:-40px;width:35px;} <br/>em{font-style:normal;display:block;position:absolute;top:-25px;left:-70px;width:55x}<br/>. {background:#BDBABD;} <br/> 用div+css模擬表格對角線 類別 姓名 年級 班級 成績 班級均分 張三 三 2 62 61 李四 三 1 48 67 王五 三 5 79 63 趙六 三 4 89 66 以上就是HTML和CSS做網頁實例教學:模擬表格對角線的內容,更多相關文章請關注PHP中文網(www.php.cn)! 🎜🎜🎜