实现如图所示的三角形图标：
html代码如下：
登录后复制
css样式：
- body{background:#faf7ef;}div{margin:20px auto}div.arrow-up { width:0px; height:0px; border-left:50px solid transparent; border-right:50px solid transparent; border-bottom:50px solid #ff0000; font-size:0px; line-height:0px;} div.arrow-down { width:0px; height:0px; border-left:50px solid transparent; border-right:50px solid transparent; border-top:50px solid #0000ff; font-size:0px; line-height:0px;} div.arrow-left { width:0px; height:0px; border-bottom:50px solid transparent; border-top:50px solid transparent; border-right:50px solid #008000; font-size:0px; line-height:0px;} div.arrow-right { width:0px; height:0px; border-bottom:50px solid transparent; border-top:50px solid transparent; border-left:50px solid #ffff00; font-size:0px; line-height:0px;}
登录后复制
立即学习“前端免费学习笔记（深入）”；
作者：风雨后见彩虹
出处：http://www.cnblogs.com/moqiutao/
如果您觉得本文对您的学习有所帮助，请多支持与鼓励。
立即学习“前端免费学习笔记（深入）”；
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
