45个值得收藏的CSS形状

33.徽章丝带

#badge-ribbon {  
position: relative;  
background: red;  
height: 100px;  
width: 100px;  
border-radius: 50px;  
}  
#badge-ribbon:before,  
#badge-ribbon:after {  
content: '';  
position: absolute;  
border-bottom: 70px solid red;  
border-left: 40px solid transparent;  
border-right: 40px solid transparent;  
top: 70px;  
left: -10px;  
transform: rotate(-140deg);  
}  
#badge-ribbon:after {  
left: auto;  
right: -10px;  
transform: rotate(140deg);  
}  

（编辑：南平站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!