在網(wǎng)站設(shè)計(jì)中，圖片是不可或缺的元素。而CSS樣式可以讓我們更好地掌控圖片的顯示方式。下面就來介紹一下CSS樣式中關(guān)于標(biāo)簽的設(shè)置。

img {
max-width: 100%; /* 如圖過長，保證不超出容器寬度 */
height: auto; /* 保留原始比例 */
display: block; /* 元素變成塊級元素，充滿父元素寬度 */
margin: 0 auto; /* 水平居中 */
}

上述代碼中，max-width屬性可以讓當(dāng)圖片比容器寬度還寬時(shí)，自動(dòng)將圖片縮放到容器寬度內(nèi)。height屬性則保證了圖片比例不失真。display屬性將標(biāo)簽轉(zhuǎn)變?yōu)閴K級元素，充滿父元素寬度。而margin屬性將圖片居中顯示。

此外，CSS還提供了許多其他的圖片樣式屬性，如border、border-radius、box-shadow等，可以讓圖片更加美觀。

img {
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
border: 2px solid black; /* 設(shè)置邊框 */
border-radius: 10px; /* 設(shè)置圓角邊框 */
box-shadow: 3px 3px 3px #ccc; /* 添加陰影效果 */
}

通過這些樣式屬性的設(shè)置，我們可以制作出更加出色的圖片效果，進(jìn)而提高網(wǎng)站的用戶體驗(yàn)。