div+css实现玻璃杯子放铅笔尺子效果代码
代码语言:html
所属分类:布局界面
代码描述:div+css实现玻璃杯子放铅笔尺子效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
html,body {
margin:0;
padding:0;
height:100%
}
body {
background:linear-gradient(#b5d3d6 60%,#fff);
background-repeat:no-repeat
}
.stage {
position:absolute;
width:400px;
height:500px;
left:50%;
top:50%;
transform:translate(-50%,-40%) scale(0.7)
}
.jar {
position:absolute;
opacity:.8;
left:0;
bottom:-30px;
width:400px;
height:420px;
background:#e7e7e7;
background-image:linear-gradient(90deg,#a8a8a8 0,#a9a9a9 12%,#aeaeae 13%,#eee 30%,#f5f5f5 70%,#d3d3d3 98%);
border-radius:5%/60%;
transform:perspective(20px) rotateX(-1deg);
z-index:1
}
.jar:before {
content:"";
position:absolute;
width:380px;
height:80px;
background:#e7e7e7;
background-image:linear-gradient(90deg,#424242 0,#909090 10%,#a8a8a8 20%,#a8a8a8 25%,#ababab 25%,#f8f8f8 30%,#e7e7e7 32%,#e7e7e.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0