Css 如何将长方体阴影添加到其高度的一半

我正在尝试添加阴影到一个div。阴影应该在顶部和其高度的一半（从顶部到左侧和右侧），有人请帮助我

.test{
宽度：200px；
高度：200px；
利润率：10px；
边框：实心1px红色；
位置：相对位置；
背景色：白色；
}

您可以增加偏移量并减小长方体阴影的大小，然后绘制其中的两个

/*偏移-x |偏移-y |模糊半径|扩散半径|颜色*/

这是第四个值。正值将使阴影扩大并变大，负值将使阴影缩小。如果未指定，它将为0（阴影将与元素大小相同）

#测试{
宽度：200px；
高度：200px；
利润率：10px；
边框：实心1px红色；
位置：相对位置；
背景色：白色；
盒影：-50px-50px 5px-50px，50px-50px 5px-50px
}

---

这可能是一种简单的方法，有很多可能性

.parent{
宽度：200px；
高度：200px；
利润率：10px；
位置：相对位置；
}
.测试{
z指数：2；
宽度：100%；
位置：相对位置；
身高：100%；
边框：实心1px红色；
背景色：白色；
}
半影{
位置：绝对位置；
宽度：100%；
排名：0；
身高：50%；
盒影：1px0px 10pxRGBA（0,0,0,0.5）；
}

---

请提供您想要实现的目标的演示。另外，您是否知道CSS选择器（即

.test

）不会以ID为

test

的元素为目标。