用css制作无图片三角形

今天在站长平台上看到一篇关于 “ 网站性能优化之CSS无图片技术”的文章,感触比较深,有做前端的我,自叹不如,高手如云。

特意取一段css代码试了一下,纯css制作的三角形,神奇,贴分享

CSS代码:

.arrow {
display:block;
width:0;
height:0;
font-size:0;
border-width:5px;
border-style:solid;
border-color:#f60 #ffffff #ffffff #ffffff
}

html代码:

<div class=”array”></div>

参考文章:
http://udc.weibo.com/

CSS3制作教程
http://www.qianduan.net/css3-icon-font-guide.html

此条目发表在 CSS Hack 分类目录,贴了 , , 标签。将固定链接加入收藏夹。

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>