CSS图形
下面的示例展示了使用纯CSS制作的各种图形，你可以自由地修改文中的CSS代码。这个收集的原文在这里。
经测试，IE9, Chrome, FF, Safari都可以正常显示。
目录
正方形
长方形
圆形
椭圆形
三角形（向上）
三角形（向下）
三角形（向左）
三角形（向右）
三角形（左上）
三角形（右上）
三角形（左下）
三角形（右下）
平行四边行
梯形
六角星形
五角星形 via Kit MacAllister
五边形
六边形
八边形
菱形
鸡蛋
吃豆人
说话泡泡
12星形 via Alan Johnson
8星形 via Alan Johnson
(全文完)
（转载本站文章请注明作者和出处 宝酷 – sou-ip ，请勿用于任何商业用途）
(14 人打了分，平均分： 3.57 )
Loading...
《CSS图形》的相关评论
有意思。
看上去很美，问题是天朝有多少浏览器能支持？
厉害!
不了解原理,好好研究下
@路人asdf
天朝有游览器？
厉害厉害！！
可惜我大天朝都是IE6
不理他群只用IE6的XX，强制升级！
呵呵，那个心不错啊
非常给力！
@路人asdf Android/iPhone/iPad 全部支持
越到后面越给力嘛。
何必呢 如果一个一个像素拼 什么画不出
向上三角形，改成
#triangle-up {
width: 0;
height: 0;
border-left: 50px dashed transparent;
border-right: 50px dashed transparent;
border-bottom: 100px solid #f66;
line-height:0;
}
可以兼容ie6
你应该不是做网页设计的，IE6 其实也能画出这些图形，只是后来 w3c 的标准更硬气
关键问题一直不是哪个浏览器能做什么，而是开发人员能不能用一样的代码来完成一致的效果，目前来说还是不行
@Kunagisa 我是 ie8.0 ,chrome15.0,ff5.0.
现在设计师的难题就是，同样的代码在不同的浏览器里效果不一样吧。很纠结人啊。
效果很炫，就可惜的是支持率不怎么好^_^
厉害
@郁江丫头
试过还不错了
@on
si
oo
win7+IE9
圆形椭圆菱形什么的都是方的……
好犀利啊，不过ie9里面好像有点问题。
标题，用css3做标题，可能更准确，呵呵
太给力了，当图片用，哇咔咔
这个很有意思啊
哇，神棍帖啊！！！！立马用IE测试一下看看。
ie9 好多都显示不出来
很有意思。
IE6下面，大多是悲剧
蛋疼，CSS不应该这么滥用。
用Chrome16看的文章。
用IE8测试有问题，连CODE都不能显示！
Why is there a ?
It makes an IE 9 display the IE 7 standards mode, and I used F12 to switch to IE 9 mode.
You see the F12. The document mode is IE7 standards, right?
I meant <meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ />
跟着写了一遍，好累呀~~ 而且，真变态！！哈哈
win7带的IE9都不兼容。。。
确实很强大，可惜现在还不怎么用的着，不兼容
从头到尾研究了一遍，学会了很多东西，谢谢啦~