overflow： hidden 怎么显示图片

`overflow: hidden;` 是CSS的一个属性设置，它通常用于防止内容溢出元素的可见区域。当应用于一个包含图片的容器时，如果图片尺寸大于该容器，隐藏（hidden）效果会让超出部分不可见，图片会被裁剪或者缩放以适应容器的大小。

如果你想让图片仍然完整显示并保持原图比例，但又希望隐藏溢出的部分，可以采用以下几种方法：

1. **设置最大宽度**：使用 `max-width: 100%;` 和 `height: auto;`，这会使图片按其原始宽度填充可用空间，高度自动调整以保持纵横比。

.container {
  max-width: 100%;
  height: auto;
  overflow: hidden;
}

2. **使用 CSS 盒模型**：对于块级元素，可以使用 `box-sizing: border-box;` 来包含内边距和边框在元素的总宽度计算中，从而不会导致溢出。

.container {
  box-sizing: border-box;
  overflow: hidden;
}

3. **使用 `position: relative` 和 `clip-path`**：如果你想要更复杂的剪切效果，可以使用 `position: relative;` 配合 `clip-path` 属性来定制图像的显示区域。

.container {
  position: relative;
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}