設(shè)置圖片寬度和高度在CSS中是一個常見的需求,我們可以使用CSS的width
和height
屬性來調(diào)整圖片的尺寸,這兩個屬性都接受像素、百分比、em等單位。
如果你想要將圖片的寬度設(shè)置為100像素,高度設(shè)置為50像素,你可以這樣寫:
img { width: 100px; height: 50px; }
如果你想要將圖片的寬度設(shè)置為其原始寬度的50%,高度設(shè)置為100像素,你可以這樣寫:
img { width: 50%; height: 100px; }
如果圖片的原始比例與設(shè)置的寬度和高度不匹配,那么圖片可能會變形,為了避免這種情況,你可以使用object-fit
屬性來保持圖片的原始比例:
img { width: 50%; height: 100px; object-fit: contain; }
這樣,無論圖片的原始比例是什么,它都會被縮放并保持在其容器內(nèi),而不會變形。
版權(quán)聲明:除非特別標(biāo)注,否則均為本站原創(chuàng)文章,轉(zhuǎn)載時請以鏈接形式注明文章出處。