CSS 使用伪元素的仅底部阴影

示例

JSFiddle:https://jsfiddle.net/UnsungHero97/80qod7aL/2/

的HTML

<div class="box_shadow"></div>

的CSS

.box_shadow {

  background-color: #1C90F3;

  width: 200px;

  height: 100px;

  margin: 50px;

}

.box_shadow:after {

  content: "";

  width: 190px;

  height: 1px;

  margin-top: 98px;

  margin-left: 5px;

  display: block;

  position: absolute;

  z-index: -1;

  -webkit-box-shadow: 0px 0px 8px 2px #444444;

     -moz-box-shadow: 0px 0px 8px 2px #444444;

          box-shadow: 0px 0px 8px 2px #444444;

}

以上是 CSS 使用伪元素的仅底部阴影 的全部内容, 来源链接: utcz.com/z/361120.html

回到顶部