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