用div+css模拟表格对角线
在蓝色理想上看到一篇用css写的对角线,觉得很有用。把代码down下来一看,发现原来就是巧妙地运用了border属性。
以前我也曾用border属性写过三角形,http://ice-cream.iteye.com/blog/172777
和对角线的原理基本一样
http://www.agoit.com/upload/attachment/73801/3c2db7e5-d70b-3b08-97cd-6e5732fb29e1.jpg
css代码的精华部分
/*模拟对角线*/.out{ border-top:40px #d6d3d6 solid;/*上边框宽度等于表格第一行行高*/ width:0px;/*让容器宽度为0*/ height:0px;/*让容器高度为0*/ border-left:80px #bdbabd solid;/*左边框宽度等于表格第一列宽度*/ position:relative;/*让里面的两个子容器绝对定位*/ top:0;}b{font-style:normal;display:block;position:absolute;top:-40px;left:-40px;}em{font-style:normal;display:block;position:absolute;top:-25px;left:-70px;}
页:
[1]