用css做的小米logo。html5可见

@Ta 2014-04-05 3775点击
http://zqqcom.tk/tool/b.htm

<html>
<head>
<style>
body{background-color: #ccc;}
#main{background-color: #f57923;
width: 415px;height:300px;
margin: 150px auto;
border-radius: 25px;}
#left,#right{background-color: #fff;
margin-top:40px;
height:220px;}
#left{float:left;
width:250px;
margin-left:35px;
border-top-right-radius: 65px;
z-index: -99999;}
#inner{background-color: #f57923;
width:140px;
height: 170px;
margin-top:50px;
border-top-right-radius: 40px;
margin-left: 55px;
z-index:10; }
#center{background-color:#fff;
position: relative;
width: 50px;
height: 125px;
top:45px;
left: 45px;
z-index:999999; }
#right{float: right;
width: 50px;
margin-right:35px;}
</style><title>❦Lonely﹏sunny</title>
</head>
<body>
<div id=”main”>
<div id=”left”>
<div id=”inner”>
<div id=”center”></div>
</div>
</div>
<div id=”right”></div>
</div>
</body>
</html>

卧草眼瞎了
回复列表(4|隐藏机器人聊天)
  • @Ta / 2014-04-06 / /
    没看到
  • @Ta / 2014-04-06 / /
    <!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>遨游、小米logo</title><meta name="description" content=""><meta name="keywords" content=""><style type="text/css">  .fl{ float: left; margin-left: 20px;}  .aoyou{   width: 240px;    height: 240px;   border-radius: 120px;   background:#b1e4ff;   border:2px solid #789cb6;   box-shadow: 5px 5px 7px #999;   -moz-border-radius: 120px;  }  .aoyou1{   width: 230px;   height: 230px;   border-radius: 115px;   position: relative;   top:5px;   left:5px;   background:#3b99e3;   -moz-border-radius: 115px;  }  .aoyou2{   width: 150px;    height: 100px;   background:#ffffff;   position: relative;   top:70px;   left:42px;   border-radius: 3px 20px 3px 3px;   -moz-border-radius: 3px 20px 3px 3px;  }  .aoyou3{   width: 35px;    height: 45px;   background:#ffffff;   position: relative;   top:30px;   left:33px;   border:25px solid #3b99e3;  }/**=================下面是小米的logo=====================**/ .xiaomi_bg{  position:relative; width: 305px;  height: 305px;  background: #FF6F3D;  border-radius: 20px;}.xiaomi_nei1{ position:absolute; left: 60px; top: 95px; border-radius:0px 20px 0px 0px; background: #fff; height:115px; width: 130px;}.xiaomi_nei2{ position: absolute; right: 60px; top: 95px; width: 30px; height: 115px; background: #fff;}.xiaomi_nei3{ position: absolute; background: #fff; border: 20px #FF6F3D solid; left: 30px; top: 25px; width: 30px; height: 70px; border-top-right-radius: 20px;}</style></head><body><!--遨游logo-->    <div class="aoyou fl"> <div class="aoyou1"> <div class="aoyou2"> <div class="aoyou3"></div> </div> </div>         </div><!--end 遨游--><!--小米logo--><div class="xiaomi_bg fl"> <div class="xiaomi_nei1"> <div class="xiaomi_nei3"></div> </div> <div class="xiaomi_nei2"></div></div><!--end 小米logo-->    </body></html>
  • @Ta / 2014-04-06 / /


  • @Ta / 2014-05-25 / /
    同楼下
添加新回复
回复需要登录