css3.0 圖形構成例項練習一
- 多媒體
- 關注:2.34W次
html部分內容
css部分
*{ padding:0; margin:0;}
er{ width:300px; margin:100px auto; position:relative; }
_left,_right{
width:30px;
height:30px;
background:#FFF;
position:absolute;
border:70px solid #0C0;
border-radius:160px;
-moz-border-radius:160px;
-webkit-border-radius:160px;
-o-border-radius:160px;}
_left{
left:10px;
top:0px;}
_right{
right:0px;
top:0px;}
_bottom{
width:200px;
border:#0C0 solid 60px;
border-radius:160px;
-moz-border-radius:160px;
-webkit-border-radius:160px;
-o-border-radius:160px;
height:30px;
left:0px;
position:absolute;
top:120px;
z-index:-5;}
_in{
background:#0C0;
height:30px;
width:30px;
position:absolute;
right:-30px;
top:-30px;
border:#FFF 30px solid;
border-radius:160px;
-moz-border-radius:160px;
-webkit-border-radius:160px;
-o-border-radius:160px;}
- 文章版權屬於文章作者所有,轉載請註明 https://xuewengu.com/zh-tw/flhy/duomeiti/9gv0m1.html