首页 > Web开发 > 详细

css 生成三角形

时间:2016-06-19 11:22:25      阅读:142      评论:0      收藏:0      [点我收藏+]

1,生成有填充颜色的三角形

some-class {

  width: 0;

  height: 0;

  border-left: 20px solid transparent;

  border-right: 20px solid transparent;

  border-bottom: 40px solid red;

}

或者

some-class {

  width: 0;

  height: 0;

  border-width: 20px;

  border-style: solid;

  border-color: transparent transparent red transparent;

}

2,生成没有颜色填充的三角形

some-class {

  display: block;

  width: 5px;

  height: 5px;

  border-color: transparent transparent #fff #fff;

  border-style: solid;

  border-width: 2px;

  transform: rotate(-45deg);

}

css 生成三角形

原文:http://www.cnblogs.com/yezongyang/p/5597532.html

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