首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 平面设计 > 图形图像 >

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

2013-08-01 
纯CSS画的基本图形(矩形、圆形、三角形、多边形、爱心、八卦等)【转】12345678910111213141516171819202122232425

纯CSS画的基本图形(矩形、圆形、三角形、多边形、爱心、八卦等)【转】
12345678910111213141516171819202122232425262728293031323334#yin-yang {????width: 96px;????height: 48px;????background: #eee;????border-color: red;????border-style: solid;????border-width: 2px 2px 50px 2px;????border-radius: 100%;????position: relative;}?#yin-yang:before {????content: "";????position: absolute;????top: 50%;????left: 0;????background: #eee;????border: 18px solid red;????border-radius: 100%;????width: 12px;????height: 12px;}?#yin-yang:after {????content: "";????position: absolute;????top: 50%;????left: 50%;????background: red;????border: 18px solid #eee;????border-radius:100%;????width: 12px;????height: 12px;}

好了,就到这里了,一共28个,个人觉得后面几个比较犀利。这些代码的来源是css-tricks。由青藤屋博客整理,转载请保留原文链接:
http://www.itivy.com/ivy/archive/2012/1/16/css-shape.html

热点排行