CSS框阴影

Question

有人能帮我解决我在下面的CSS代码中犯的错误吗？我想学习，我想制作附件中的图片。说明如下：样式：

• 宽度： 400 px，
• 高度： 100 px，
• 背景颜色：米色，
• 阴影居中，5像素模糊，5像素阴影宽度，颜色rgba（0,0,0,0.3），
• 水平居中，字体大小50 px，从顶部移动20 px，字体重量700，
• 圆角：20像素。

我的代码

.test {
    width: 400px;
    height: 100px;
    background-color: beige;
    border-radius: 20px;
    text-align: center;
    font-size: 50px;
    font-weight: 700;
    box-shadow: inset 5 5 5px rgba(0, 0, 0, 0.3)}

非常感谢。

Answer 1

Try:box shadow:inset 5px 5px 5px rgba（0,0,0,0.3）；

Answer 2

.test {
    width: 400px;
    height: 100px;
    background-color: beige;
    border-radius: 20px;
    text-align: center;
    font-size: 50px;
    font-weight: 700;
    padding-top: 20px;
    box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.3)}

添加了填充顶部，以满足文本从顶部移动20像素的要求。我相信这里还有你需要的一切。