css3如何设置左右有盒子阴影，上下没有

可以使用box-shadow属性来设置盒子阴影，语法如下：

box-shadow: 水平偏移量 垂直偏移量 模糊半径 阴影尺寸 阴影颜色;

例如，要设置左右有盒子阴影，上下没有，可以这样写：

box-shadow: 10px px 5px -5px #888888, -10px px 5px -5px #888888;

其中，第一个阴影设置水平偏移量为10px，垂直偏移量为px，模糊半径为5px，阴影尺寸为-5px（表示阴影在盒子内部），阴影颜色为#888888；第二个阴影设置水平偏移量为-10px，其它属性与第一个阴影相同，表示在盒子左侧也有一个相同的阴影。这样就可以实现左右有盒子阴影，上下没有的效果。

相关问题

css盒子上下左右内阴影

要在 CSS 盒子的上下左右四个方向添加内阴影，可以使用 box-shadow 属性。

以下是一个例子：

div {
  box-shadow: inset 10px 10px 10px -10px rgba(0, 0, 0, 0.5), inset -10px -10px 10px -10px rgba(0, 0, 0, 0.5);
}

上面的代码中，box-shadow 属性设置了两个 inset 类型的阴影，一个在右下角，一个在左上角。每个阴影都有四个参数，分别是水平偏移量、垂直偏移量、模糊半径和阴影大小。第一个阴影的水平偏移量是 10px，垂直偏移量是 10px，模糊半径是 10px，阴影大小是 -10px，颜色是 rgba(0, 0, 0, 0.5)。第二个阴影和第一个阴影相似，只是水平偏移量和垂直偏移量变成了负数。这两个阴影组合起来就形成了一个上下左右四个方向的内阴影。

css 盒子上下左右居中

要将 CSS 盒子上下左右居中，可以使用以下方法：

方法1: 使用 Flexbox（弹性布局）

.container {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
}

方法2: 使用绝对定位和负边距

.container {
  position: relative;
}

.box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

方法3: 使用绝对定位和 margin:auto

.container {
  position: relative;
}

.box {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

以上三种方法都可以实现盒子的居中效果，选择其中一种适合你的情况即可。