p {
width:500px;
height:100px;
line-height:100px;
text-align:center;
background:#FFF;
}
.box-shadow1 {
position:relative;
box-shadow:0 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
}
box-shadow1:after,.box-shadow1:before {
content:'';
z-index:-1;
position:absolute;
top:50%;
bottom:0;
left:10px;
right:10px;
box-shadow:0 0 20px rgba(0,0,0,0.8);
border-radius:100px/10px;
}
.box-shadow2 {
position:relative;
-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 60px rgba(0,0,0,0.1) inset;
-moz-box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 60px rgba(0,0,0,0.1) inset;
-o-box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 60px rgba(0,0,0,0.1) inset;
box-shadow:0 1px 4px rgba(0,0,0,0.27),0 0 60px rgba(0,0,0,0.1) inset;
}
.box-shadow2:before,.box-shadow2:after {
content:"";
position:absolute;
top:20px;
bottom:22px;
background:transparent;
box-shadow:0 8px 20px rgba(0,0,0,0.7);
z-index:-1;
background:#fff;
}
.box-shadow2:before {
left:22px;
right:12px;
-webkit-transform:skew(-12deg) rotate(-4deg);
-moz-transform:skew(-12deg) rotate(-4deg);
-o-transform:skew(-12deg) rotate(-4deg);
-ms-transform:skew(-12deg) rotate(-4deg);
}
.box-shadow2:after {
left:12px;
right:22px;
-webkit-transform:skew(12deg) rotate(4deg);
-moz-transform:skew(12deg) rotate(4deg);
-o-transform:skew(12deg) rotate(4deg);
-ms-transform:skew(12deg) rotate(4deg);
}
更新时间:2020-07-22 16:45:23