CSS 样式实现单边阴影

(转自https://blog.csdn.net/qq_34636440/article/details/80552013)
CSS 中有一个用于实现边框的阴影的属性 box-shadow。

如果要实现单边阴影对 box-shadow属性值需要进行特别的设定，才可以到达效果。

.shadow-only-bottom{ box-shadow: 0px 7px 7px -7px #5E5E5E;  }
.shadow-only-right{ box-shadow: 7px 0px 7px -7px #5E5E5E;  }
.shadow-only-left{ box-shadow: -7px 0px 7px -7px #5E5E5E;  }
.showdow-only-top{ box-shadow: 0px -7px 7px -7px #5E5E5E;  }

若要实现内阴影

.shadow-only-top{ box-shadow: inset 0px 7px 7px -7px #5E5E5E;  }
.shadow-only-right{ box-shadow:inset  7px 0px 7px -7px #5E5E5E;  }
.shadow-only-left{ box-shadow:inset  -7px 0px 7px -7px #5E5E5E;  }
.showdow-only-bottom{ box-shadow:inset 0px -7px 7px -7px #5E5E5E;  }