Back to home
[网页代码]css+div绘制太极图
2014-04-07 22:14:08 -0700
代码说明
转自清风明月
HTML代码
<style> #yuan{background-color:#fff; width:100px; height:50px; border-top:2px solid #000; border-right:2px solid #000; border-bottom:50px solid #000; border-left:2px solid #000; border-radius:100px; position:relative;/*设置为对象的参照物， 不设侧以网页左上角为参照物*/ } #yuan::after{ content:''; width:10px; height:10px; border:20px solid #000;/*这是左边添加的圆，边框为20像素，显示为黑色*/ position:absolute; left:0px; top:25px; border-radius:50px; background:#fff; /*这是圆背景，就是黑色里面的那个白点，以下同理，，不懂可留言询问*/ } #yuan::before{ content:''; width:10px; height:10px; border:20px solid #fff; position:absolute; right:0px; top:25px; border-radius:50px; background:#000; } </style>
代码演示
«Newer
Older»
Comment:
Name:
Back to home
Subscribe
|
Register
|
Login
|
N