CSS設置圖片寬高有兩種方式,一種是通過CSS的width和height屬性來設置圖片的寬度和高度,另一種是通過CSS的max-width和max-height屬性來設置圖片的***大寬度和高度。
我們來看看如何通過CSS的width和height屬性來設置圖片的寬度和高度,在CSS中,我們可以使用像素(px)、百分比(%)、em等單位來設置圖片的寬度和高度,我們可以將圖片的寬度設置為500像素,高度設置為300像素,只需要在CSS中添加以下代碼:
img { width: 500px; height: 300px; }
我們來看看如何通過CSS的max-width和max-height屬性來設置圖片的***大寬度和高度,與width和height屬性不同,max-width和max-height屬性只會將圖片縮小到指定的寬度和高度,而不會放大圖片,我們可以將圖片的***大寬度設置為1000像素,***大高度設置為600像素,只需要在CSS中添加以下代碼:
img { max-width: 1000px; max-height: 600px; }
需要注意的是,如果圖片本身的寬度或高度大于我們設置的max-width或max-height值,那么圖片就會被縮小到指定的寬度或高度,如果圖片本身的寬度或高度小于我們設置的max-width或max-height值,那么圖片就會保持其原始大小。
CSS提供了兩種方式來設置圖片的寬度和高度,我們可以根據具體的需求來選擇使用哪種方式。