css防止盒子被撑开

CSS中有一种技术可以防止某个元素的宽度或高度自动填充内容过多，导致其“撑开”父容器，那就是设置`overflow`属性。`overflow`属性控制元素在其内容溢出时的行为：

1. **`auto`** 或者默认值：如果内容超出容器，通常元素会显示滚动条，允许用户查看所有内容。
2. **`hidden`**: 内容不会显示出来，也不会有滚动条，超过的部分会被剪切掉，隐藏起来。
3. **`scroll`**: 和`auto`类似，但总是显示滚动条，不论是否需要。
4. **`visible`**: 如果内容溢出，就让它们可见，可能会看到滚动条。
5. **`clip`**: 可以更精确地裁剪内容，通过`rect(x y width height)`指定裁剪区域。

为了阻止块级元素的内容自动撑开，你可以将`width`和`height`设置成具体的数值，并结合`overflow`属性为`hidden`。例如：

.box {
  width: 200px; /* 宽度限定 */
  height: 100px; /* 高度限定 */
  overflow: hidden;
}