在CSS中,如果想要讓圖片占據(jù)100%的寬度或高度,可以使用以下屬性:
1、width: 100%;
2、height: 100%;
這兩個(gè)屬性分別表示圖片的寬度和高度將占據(jù)其容器的100%,如果你有一個(gè)圖片元素,你可以這樣寫:
<img src="image.jpg" style="width: 100%; height: 100%;">
這將使圖片的大小完全匹配其容器的大小,如果圖片的原始寬高比與容器不同,圖片可能會(huì)顯得拉伸或壓縮,為了保持圖片的原始寬高比,可以使用object-fit
屬性:
<img src="image.jpg" style="width: 100%; height: 100%; object-fit: cover;">
這將確保圖片始終在容器內(nèi)保持其原始寬高比,同時(shí)填充整個(gè)容器。object-fit
屬性在IE瀏覽器中不受支持,如果你需要支持IE瀏覽器,可能需要使用其他方法或技術(shù)來(lái)實(shí)現(xiàn)相同的效果。