纯CSS画的基本图形(矩形、圆形、三角形、多边形、爱心、八卦等)

时间:2012-06-19 11:10:02  来源:第二电脑网  作者:第二电脑网

  第二电脑网导读:打开这篇文章的时候,我希望你用的是firefox或者chrome,当然IE也能看一部分的。那好,下面就一起来看看我们是如何用纯CSS来画这些图形的,如果你也觉得很震撼,推荐给你的朋友吧。 #square { width: 100px; height: 100px; background: red; } #rectangle { width: 200px; height: 100px; background: red; } #circle { width: 100px; height: 100p...
  正文:简介:今天在Css-tricks上看到一篇文章,那篇文章让我不禁心头一震,强大的CSS啊,居然能画出这么多基本的图形

图形包括基本的矩形、圆形、椭圆、三角形、多边形,也包括稍微复杂一点的爱心、钻石、阴阳八卦等。当然有一些需要用到CSS3的属性,所以在你打开这篇文章的时候,我希望你用的是firefox或者chrome,当然IE也能看一部分的。那好,下面就一起来看看我们是如何用纯CSS来画这些图形的,如果你也觉得很震撼,推荐给你的朋友吧。