html加css绘制oprea的logo,【CSS3绘画】CSS3制作出来的Opera浏览器Logo

[CSS3绘画] CSS3制作出来的Opera浏览器Logo

body{ margin:50px; padding:0px;}

div{ margin:0 auto; overflow:hidden;}

.O{

width:400px; height:420px;

border:2px solid #FEA5A5;

border-radius:200px;

-moz-border-radius: 200px/210px; -webkit-border-radius: 200px 210px; border-radius: 200px/210px;

background:#FFCBCB;

background:-webkit-gradient(linear, center top, center bottom, from(#ffcbcb), to(#CF0109));

background: -moz-linear-gradient(top, #ffcbcb, #ffcbcb, #CF0109);

-moz-box-shadow:0px 50px 30px hsla(0,0%,0%,.2); -webkit-box-shadow:0px 50px 30px hsla(0,0%,0%,.2);

position:relative;

}

.O_2{

width:400px; height:360px;

padding:25px 0px;

border-radius:200px;-moz-border-radius: 200px/210px; -webkit-border-radius: 200px 210px; border-radius: 200px/210px;

position:absolute; left:0px; top:7px;

background:#FD8487;

background:-webkit-gradient(linear, center top, center bottom, from(#FD8487), to(#A90203));

background: -moz-linear-gradient(top, #f36569, #f36569, #A90203);

}

.O_3{

width:194px; height:354px;

padding:3px;

border-radius:97px; -moz-border-radius: 97px/177px; -webkit-border-radius: 97px 177px; border-radius: 97px/177px;

background:#CF3C3A;

background:-webkit-gradient(linear, center top, center bottom, from(#CF3C3A), to(#D20000));

background: -moz-linear-gradient(top, #CF3C3A, #CF3C3A, #D20000);

}

.O_4{

width:174px; height:334px;

padding:10px;

border-radius:97px;-moz-border-radius: 97px/177px; -webkit-border-radius: 97px 177px; border-radius: 97px/177px;

background:#9A0000;

background:-webkit-gradient(linear, center top, center bottom, from(#9A0000), to(#B80000));

background: -moz-linear-gradient(top, #9A0000, #9A0000, #B80000);

}

.O_5{

width:174px; height:334px;

border-radius:87px;-moz-border-radius: 87px/167px; -webkit-border-radius: 87px 167px; border-radius: 87px/167px;

background:#fff;

}

支持浏览器 chrome、firefox、360

原地址查看：http://www.w3cfuns.com/thread-5592900-1-1.html

原文：http://www.cnblogs.com/xiaoky/p/3850771.html