定义一个矩形,将矩形的宽高设置为0,可以发现border的四个边都是一个三角形,要实现三角形只需将其中几个边background设置为transparent,即可得到三角形.
<div class="triangle"></div>
.triangle{
width: 0;
height: 0;
border-top: 50px solid transparent;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 50px solid red;
}
demo演示地址:http://demo.crazyming.com/?link=topic/d6/css三角形.html
1.如需转载本站原创文章,请务必注明文章出处并附上链接,非常感谢。
2.本站用于记录个人 工作、学习、生活,非商业网站,更多信息请 点击这里
下一篇: [转载]PHP文件头BOM头问题