H5 圖片是網頁中常用的一種元素，它能夠很好地補充網頁內容，提高視覺體驗。在使用圖片時，常常需要使用 CSS 樣式進行優化，下面我們就來看一看如何設置 H5 圖片的 CSS 樣式。

img {
width: 100%; /* 圖片寬度設置為100% */
max-width: 600px; /* 最大寬度為 600px，防止圖片過大 */
height: auto; /* 高度自動適應 */
display: block; /* 將圖片設置為塊級元素 */
margin: 0 auto; /* 圖片居中顯示 */
border-radius: 10px; /* 添加圓角邊框 */
}

在上述代碼中，我們通過使用 img 元素的 CSS 樣式，對 H5 圖片進行了優化。其中，設置了圖片寬度為 100%，最大寬度設為 600px，高度自動適應，將圖片設置為塊元素，使其居中顯示，同時還添加了圓角邊框，讓圖片更加美觀。

此外，我們還可以設置 img 元素的其他 CSS 樣式，例如：

/* 設置圖片陰影 */
img {
box-shadow: 0px 0px 10px #888888;
}
/* 設置圖片浮動 */
img {
float: left;
margin-right: 20px;
}
/* 設置圖片透明度 */
img {
opacity: 0.8;
}

通過設置不同的 CSS 樣式，我們可以讓圖片在網頁中具有更加豐富的效果，提高用戶的視覺體驗。