HTML 圖片特效讓網頁更加生動，其中最常用的特效就是圖片的縮放、滑動、淡入淡出等特效。下面我們就來看看 HTML 圖片特效的代碼實現。

//圖片縮放特效代碼
<img src="image.jpg" onmouseover="this.style.transform='scale(1.2)'" onmouseout="this.style.transform='scale(1)'">
//圖片滑動特效代碼
<div style="position: relative;">
<img src="image.jpg" style="position: absolute; top: 0px; left: 0px;" onmouseover="this.style.left='50px'" onmouseout="this.style.left='0px'">
</div>
//圖片淡入淡出特效代碼
<img src="image.jpg" class="fade">
<style>
.fade {
opacity: 1;
transition: opacity .5s ease-in-out;
}
.fade:hover {
opacity: 0.5;
}
</style>

通過上面的代碼實現，可以讓圖片在鼠標滑過時出現縮放、滑動、淡入淡出等效果，讓網頁更加生動。