Avoid an image to go outside a div?

问题

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?

回答1:

You need overflow:hidden see an example here:

http://www.jsfiddle.net/S8qAq/

Read about overflow: here W3Schools

Good luck!

回答2:

Try giving an overflow:hidden to the div.

回答3:

add overflow:hidden; to your div style.

回答4:

Use the overflow css property:

overflow: hidden;

回答5:

use

overflow:hidden;

回答6:

I am surprised no one has suggested object-fit: cover;

来源：https://stackoverflow.com/questions/4328625/avoid-an-image-to-go-outside-a-div