本文介绍一款CSS超平滑阴影，实现起来非常简单，但效果好看，实用性很强。

CSS超平滑阴影

HTML

<div class="box">
  
</div>

CSS

.box {
  box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 
              0 6.7px 5.3px rgba(0, 0, 0, 0.048), 
              0 12.5px 10px rgba(0, 0, 0, 0.06), 
              0 22.3px 17.9px rgba(0, 0, 0, 0.072), 
              0 41.8px 33.4px rgba(0, 0, 0, 0.086),
              0 100px 80px rgba(0, 0, 0, 0.12);
  height: 250px;
  width: 350px;
  margin: 100px auto;
  background: white;
  border-radius: 5px;
}

body {
  background: #EEF2F7;
}

execcodegetcode

相关文章推荐

  • 8款非常漂亮的CSS 3D外观框阴影

 

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。