div+css实现可爱小兔子效果代码
代码语言:html
所属分类:布局界面
代码描述:div+css实现可爱小兔子效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
html,
body {
height: 100%;
margin: 0;
}
.shadow {
background: rgba(150,150,150,.1);
width: 150px;
height: 50px;
border-radius: 100%;
position: absolute;
top: 104px;
left: -25px;
z-index: -1;
}
.rabbit {
width: 350px;
margin: auto;
z-index: 1000;
position: relative;
}
.canvas {
background: #ADD8CE;
color: #ADD8CE;
/*width: 400px;*/
height: 100%;
position: relative;
}
/* Eears Begin*/
.rabbit-ears {
position: relative;
left: 100px;
top: 80px;
}
.rabbit-ears-outer-left {
background: white;
color: white;
height: 65px;
width: 30px;
top: 40px;
left: 60px;
position: relative;
float: left;
transform: rotate(-20deg);
border-top-left-radius: 55%;
border-top-right-radius: 55%;
border-bottom-left-radius: 60%;
border-bottom-right-radius: 60%;
}
.rabbit-ears-outer-right {
background: white;
color: white;
height: 65px;
wi.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0