当前位置： 移动技术网 > IT编程>网页制作>CSS > css 画三角形

css 画三角形

2018年02月27日  | 移动技术网IT编程  | 我要评论 
<div class='triangle-rihgt'></div>
<div class='triangle-top'></div>
<div class='triangle-left'></div>
<div class='triangle-bottom'></div>

 

.triangle-rihgt{
	width: 0;
	height: 0;
	border-bottom:10px solid  transparent;
	border-top:10px solid  transparent;
        border-left: 20px solid  red;
}
.triangle-left{
	width: 0;
	height: 0;
	border-bottom:10px solid  transparent;
        border-top:10px solid  transparent;
	border-right: 20px solid  green;
}
.triangle-top{
	width: 0;
	height: 0;
	border-right:10px solid  transparent;
	border-left:10px solid  transparent;
	border-bottom: 20px solid  #333;
}
.triangle-bottom{
	width: 0;
	height: 0;
	border-right:10px solid  transparent;
	border-left:10px solid  transparent;
	border-top: 20px solid  #999;
}

　　

 

 

css三角形

 
 
 
 

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网