body::before {
  content: "";
  position: fixed;
  top: -10px;
  left: 0;
  width: 100%;
  height: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
  z-index: 100;
}

纯css，利用伪元素实现。不需要使用图片。

是一个很好用的伪元素选择器，它的作用是在元素的内容之前插入新内容。

详细用法：

实现阴影效果，使用了 。

box-shadow 详细用法：

最后需要使用 ，并且设置一个尽可能大的值，这样页面的顶部就永远会出现一个阴影。