p標簽:
在網站的設計中,圖片的使用是非常重要的。但是,我們有時候會遇到一個問題,那就是想讓圖片灌滿一個容器,可是圖片的大小卻比容器小。在這種情況下,使用 CSS 就可以解決這個問題。下面,我們就來看看如何用 CSS 將圖片灌滿容器。
pre標簽:
img {
width: 100%;
height: 100%;
object-fit: cover;
}
在上面的 CSS 代碼中,我們使用了 object-fit 屬性。這個屬性可以指定在容器中顯示圖片的方式。cover 是其中一種值,它會讓圖片自適應容器的大小,并保持圖片的縱橫比例,直到圖片占滿整個容器。
同時,我們還需要將 img 元素的寬度和高度都設置為 100%,這將保證圖片占據整個容器。
現在,您已經知道了如何用 CSS 將圖片灌滿容器,趕快去嘗試一下吧!
上一篇docker30個命令
下一篇css圖片滑上去變大