首页 > web前端 > js教程 > 纯CSS绘制的三角形箭头图案

纯CSS绘制的三角形箭头图案

巴扎黑
发布: 2016-11-25 14:19:02
原创
1802 人浏览过

div#up { 
width: 0px; 
height: 0px; 
border-left: 5px solid transparent; 
border-right: 5px solid transparent; 
border-bottom: 5px solid#2f2f2f; 

div#down { 
width: 0px; 
height: 0px; 
border-left: 20px solid transparent; 
border-right: 20px solidtransparent; 
border-top: 20px solid #f00; 

div#left { 
width: 0px; 
height: 0px; 
border-top: 10px solid transparent; 
border-bottom: 10px solid transparent; 
border-right: 10px solidyellow; 

div#right { 
width: 0px; 
height: 0px; 
border-top: 60px solid transparent; 
border-bottom: 60px solid transparent; 
border-left: 60px solid green; 



html: 

 
 
 

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板