首页 > 其他 > 详细

用border-width,border-color画三角形

时间:2016-09-27 14:41:10      阅读:157      评论:0      收藏:0      [点我收藏+]

需要哪类三角形,比如右三角形,则border-width属性中,右边为0,在border-style中与之相反的左边呈所设定的颜色,其他边为transparent。 

1.右三角形

border-width: 10px 0 10px 10px;

border-color: transparent transparent transparent #fafafa;

border-style: solid;

技术分享

 

2.左三角形

border-width: 10px 10px 10px 0;

 border-color: transparent #fafafa transparent transparent ;

 border-style: solid;

3.上三角形

border-width: 0 10px 10px 10px;

 border-color: transparent  transparent #fafafa transparent ;

 border-style: solid;

4.下三角形

border-width: 10px 10px 0 10px;

 border-color: #fafafa transparent  transparent  transparent ;

 border-style: solid;

用border-width,border-color画三角形

原文:http://www.cnblogs.com/swii/p/5912417.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!