css画太极图示例介绍

点评：css画太极图，样式很简单，朋友们参考下下面的代码吧！

复制代码代码如下:

#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;

}