在CSS中,可以使用width
和height
屬性來(lái)設(shè)置圖片和div的大小,以下是一個(gè)示例:
<div style="width: 200px; height: 200px; background-color: #f0f0f0;"></div> <img style="width: 200px; height: 200px;" src="image.jpg" />
在這個(gè)示例中,div和img元素的寬度和高度都設(shè)置為200像素,這樣,圖片和div就會(huì)一樣大,注意,如果圖片的原始大小比指定的尺寸大或小,那么圖片可能會(huì)被拉伸或壓縮,為了避免這種情況,可以使用max-width
和max-height
屬性來(lái)限制圖片的***大寬度和高度:
<img style="max-width: 200px; max-height: 200px;" src="image.jpg" />
這樣,圖片就不會(huì)超過(guò)指定的尺寸,為了確保圖片和div在視覺(jué)上更加協(xié)調(diào),還可以設(shè)置它們的邊框和背景色:
<div style="width: 200px; height: 200px; background-color: #f0f0f0; border: 1px solid #000;"></div> <img style="max-width: 200px; max-height: 200px; border: 1px solid #000;" src="image.jpg" />
這樣,圖片和div就會(huì)更加緊密地結(jié)合在一起,形成一個(gè)統(tǒng)一的視覺(jué)效果。