我試圖用圖像填充容器,但找不到解決方案。在容器div中的圖像擬合
如果圖片太短,我需要將它們設置爲全高,但它們可能會溢出雙方。 如果圖像太窄,我需要將它們全寬,但它們可以溢出底部。
<div class="cb-img-fw four-image">
<a href="postURL"><img src="imageURL"></a>
</div>
和CSS的
.four-grid-post > .four-image{
max-height: 184px;
max-width: 271px;
overflow: hidden;
}
.four-grid-post > .four-image img{
min-width: 100%;
max-width: 100%;
height: auto;
}
我也開到jQuery的解決方案,但我的內容加載與AJAX所以它可能會引起一些問題。
的[我如何自動調整圖像大小,以適應一個div容器(可能的複製http://stackoverflow.com/questions/3029422/how-do-i-auto -resize-an-image-to-fit-a-div-container) –
@InnovaITveSolutions在該決定中,圖形不會超出塊的邊界。 –
我認爲,它的重複[是否有一個等效於背景大小:封面和包含圖像元素?](http://stackoverflow.com/questions/11670874/is-there-an-equivalent-to-background-大小覆蓋和包含圖像元素) – Tigran