码迷,mamicode.com
首页 > Web开发 > 详细

css实现一个缺口小三角

时间:2017-02-19 23:34:20      阅读:382      评论:0      收藏:0      [点我收藏+]

标签:style   实现   border   top   code   position   class   parent   nbsp   

.square{  
     width:0;  
     height:0;  
     margin:0 auto;  
     border:6px solid transparent;  
     border-bottom: 6px solid red;  //自行调整方向,.
 } 

带缺口的三角形:

<div class="box b1"></div>  
<div class="box b2"></div> 
.box{  
    position: absolute;  
    left: 0;  
    top: 0;  
    width: 0;  
    height:0;  
    border: 6px solid transparent;  
}  
.b1{  
    border-bottom-color:#000 ;  
}  
.b2{  
    border-bottom-color:#fff ;  
} 

 

css实现一个缺口小三角

标签:style   实现   border   top   code   position   class   parent   nbsp   

原文地址:http://www.cnblogs.com/by-dxm/p/6417717.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!