避免图像超出 div 范围？
我有：
<div style="height:15px">
<img src="image" />
</div>
图像大于15px，所以当你看到它时它在div之外。如何仅使用 css“裁剪”图像（仅显示其 15px 端口）？
I have:
<div style="height:15px">
<img src="image" />
</div>
The image is bigger than 15px, so it's outside the div when you see it. How do I "crop" the image (show only the 15px port of it), only using css?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（7）
您需要
overflow:hidden请参阅此处的示例：http://www.jsfiddle.net /S8qAq/
了解
溢出：此处 W3Schools祝你好运！
You need
overflow:hiddensee an example here:http://www.jsfiddle.net/S8qAq/
Read about
overflow: here W3SchoolsGood luck!
尝试为 div 添加
overflow:hidden。Try giving an
overflow:hiddento the div.将
overflow:hidden;添加到您的 div 样式中。add
overflow:hidden;to your div style.使用 CSS 溢出属性：
Use the overflow css property:
我很惊讶没有人建议
object-fit: cover;I am surprised no one has suggested
object-fit: cover;使用
use
overlow: hide、object-fit: cover;和width: fit-content它们都有自己的障碍。如果您有多个图像，那么这些方法可能无法为您提供最佳解决方案。相反，您可以定义父元素大小并强制子元素相应地适应
max-height和max-widthoverlow: hidden,object-fit: cover;andwidth: fit-contentthey come with their own hurdles. If you have more than one image, then these methods may not provide you with the best solution.Instead, you can define parent element size and force children to fit inside accordingly with
max-heightandmax-width