html - CSS 插入和输出框阴影

Question

我需要在菜单框处插入和外部阴影。

我该怎么做？

这是我的 CSS:

li.menu-list:hover {
border:solid 0.1rem white;
background-color: rgba(26, 67, 119, 0.8);
box-shadow: 0 0 1rem 0.2rem white;  
box-shadow: 0 0 1rem 0.3rem white inset;
}

Answer 1

您不能这样做，因为您正在覆盖原始值。你应该做的是:

box-shadow: 0 0 1rem 0.2rem white, 0 0 1rem 0.3rem white inset;

通过添加另一个 box-shadow 声明，您实际上是在重置框阴影并实现另一个，因此只显示一个。 CSS3 有很多这些新奇的选项，它们都可以用逗号分隔链接在一起。