css 给容器添加内部阴影

在 CSS 中，可以通过使用 box-shadow 属性来给容器添加内部阴影效果。具体方法如下：

1. 首先，定义一个容器元素，并设置其样式。

.container {
  width: 200px;
  height: 200px;
  padding: 20px;
  background-color: #fff;
}

2. 然后，在容器元素上使用 box-shadow 属性来设置内部阴影效果。将属性的值设为包含四个参数的列表，分别表示阴影的水平偏移量、垂直偏移量、模糊半径和扩展半径。还可以选择性地设置阴影的颜色。

.container {
  width: 200px;
  height: 200px;
  padding: 20px;
  background-color: #fff;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
}

上述代码中，我们在容器元素内部添加了一层模糊半径为 10 像素的黑色阴影效果。其中，inset 关键字用于指定阴影为内部阴影。这样，在容器元素内部就会出现一层阴影效果。

需要注意的是，由于内部阴影通常需要与容器元素的背景色进行对比，因此在设置阴影颜色时需要根据实际情况进行调整。另外，box-shadow 属性还支持其他的参数选项，例如多重阴影、阴影颜色渐变效果等。如果要实现不同的阴影效果，可以根据需要进行调整。