最近更新
阅读排行
关注本站

如何用CSS制作三角形

阅读:3613 次   编辑日期:2013-12-12

目录:

概述:

在Web开发的过程中,我经常会用到三角形,例如排序的时候我们就会用到向下或者向上的箭头,那么在用到箭头的时候我们一般会切个图片吧? 但是今天我们讲的方法不用任何图片,就用CSS,一起来看一看吧。

实现方法:

	.uw3c{
		display:block;
		width:0px;
		height:0px;
		font-size:0px;
		border-width:20px 10px;
		border-style:solid;
		border-color:#f00 #fff #fff #fff;
	}
理解上面的代码也非常容易,用border的宽度自己撑起,把border的3面边框设置成与背景颜色一致的颜色,剩下的一边就会成为一个三角形。
最值得推荐的是,此方法兼容所有浏览器
查看实例
将本篇文章分享到:
top