给页面顶部边缘添加一个阴影,就像这样:
body::before {
content: "";
position: fixed; /* 固定定位 */
top: -10px;
left: 0;
width: 100%;
height: 10px;
overflow:hidden;
box-shadow: 0px 0 10px rgba(0, 0, 0, 0.8);
z-index: 999; /* z-index 值设置大点,防止被覆盖 */
}
其本质就是用 body 的 伪标签,把它用固定定位,固定在页面的顶部~
做一些个性化的页面装饰可以用。