CSS图片溢出是指当一张图片的尺寸大于其容器元素尺寸时,图片将会超出容器元素的边界,而超出的部分将不可见。下面将介绍如何使用CSS来隐藏这部分溢出的内容。
img { max-width: 100%; height: auto; overflow: hidden; }
以上代码中,我们通过设置图片的最大宽度为100%来保证图片能够自适应其所在的容器宽度,同时通过设置高度为auto来保持图片的宽高比例不变。但仅仅这样设置还无法隐藏溢出内容,需要使用overflow属性来实现,将其值设置为hidden即可。
当然,也可以通过设置容器元素的宽高、定位等属性来实现图片溢出的隐藏,比如使用relative定位属性、设置容器元素的padding、margin等,都可以达到效果。不过以上是最简单、最常用的方法。