仅供新手参考学习,欢迎大家提出更多的实现方法。 模拟表格对角线 <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;text-align:center;font-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 #BDBABD solid;/*左边框宽度等于表格第一行第一格宽度*/ <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>.t1{background:#BDBABD;} <br> 用div+css模拟表格对角线 类别 姓名 年级 班级 成绩 班级均分 张三 三 2 62 61 李四 三 1 48 67 王五 三 5 79 63 赵六 三 4 89 66 以上就是HTML和CSS做网页实例教程:模拟表格对角线的内容,更多相关文章请关注PHP中文网(m.sbmmt.com)!