<! DOCTYPE html>
<TITLE>CSS3 Android Icons </title>
<style>
. android {
Position:absolute;
left:320px;
top:230px;
}
. body {
width:336px;
height:285px;
Background-color: #A5C63B;
border-radius:0px 0px 30px 30px;
Position:absolute;
}
. Body:before,
. body:after {
Background-color: #A5C63B;
Content: ";
width:75px;
height:122px;
Bottom: -122px;
Position:absolute;
border-radius:0px 0px 50px 50px;
}
. body:before {left:68px;}
. body:after{right:68px;}
. head {
width:336px;
height:155px;
Background-color: #A5C63B;
border-radius:200px 200px 0px 0px;
Position:absolute;
Top: -170px;
}
. Head:before,
. head:after {
Background-color: #A5C63B;
Content: ";
width:10px;
height:53px;
Position:absolute;
Top: -30px;
border-radius:20px 20px 0px 0px;
}
. head:after {-webkit-transform:translate (63px, 0px) rotate ( -30deg);-moz-transform:translate (63px, 0px) rotate (- 30DEG); -o-transform:translate (63px, 0px) rotate ( -30deg); }
. head:before{-webkit-transform:translate (255px, 0px) rotate (30deg);-moz-transform:translate (255px, 0px) rotate ( 30DEG); -o-transform:translate (255px, 0px) rotate (30deg); }
. Arms:before,
. arms:after {
Background-color: #A5C63B;
Content: ";
width:75px;
height:233px;
Top: -8px;
Position:absolute;
border-radius:40px 40px 40px 40px;
}
. arms:before {left: -90px;}
. arms:after{right: -90px;}
. Eyes:before,
. eyes:after {
Background-color: #FFFFFF;
Content: ";
width:27px;
height:27px;
top:68px;
Position:absolute;
border-radius:20px;
}
. eyes:before {left:78px;}
. eyes:after{right:78px;}
</style>
<body>
<div><a href= "http://www.999jiujiu.com/" >http://www.999jiujiu.com/</A></div>
<div class= "Android" >
<div class= "Head" >
<div class= "Eyes" ></div>
</div>
<div class= "Body" >
<div class= "Arms" ></div>
</div>
</div>
</body>
CSS3 implementation Android icon
