小程序顶部导航box-shadow实现

image.png

使用伪类

最外层的box 使用设class = container：
css：

.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  position: relative;
} 
.container::after{
  content: '';
  box-shadow:0 2rpx 25rpx 10rpx rgb(236, 236, 236);
  position: absolute;
  width: 100%;
}

box-shadow用法：

box-shadow: h-shadow v-shadow blur spread color inset;

image.png