HTML5是一個功能強大的網站開發技術，其中包括許多令人驚嘆的特效和功能。在HTML5中，我們可以利用鼠標經過圖片的事件來添加一些特殊的效果，比如縮放，旋轉和透明度變化。以下是一個HTML5鼠標經過圖片特效的例子：
<!DOCTYPE html>
<html>
<head>
<style>
#image {
width: 200px;
height: 200px;
transition: all 0.5s ease;
}
#image:hover {
transform: scale(1.2);
opacity: 0.7;
}
</style>
</head>
<body>
<img id="image" src="image.jpg" alt="image">
</body>
</html>在上面的代碼中，我們首先創建了一個具有id為“image”的img標簽，表示圖片。我們利用CSS給圖片分配了寬度和高度，并使用transition屬性為所有動畫效果添加0.5秒的過渡時間。然后，我們使用:hover偽類選擇器為圖片添加了懸停效果。
當用戶將鼠標懸停在圖片上時，我們利用CSS3的transform屬性縮放了圖片的大小，使其顯示為原來的120%。我們還使用opacity屬性在懸停狀態下將圖片的透明度降低到0.7，以便突出顯示鼠標經過的效果。
總之，鼠標經過圖片的動畫效果是一個很棒的HTML5特效，可以為網站增加一些互動性和視覺吸引力。通過使用以上代碼，您可以為網站的圖片添加相應的效果，讓用戶在瀏覽您的網站時獲得更好的體驗。
上一篇css圖片顯示透明度漸變
下一篇css圖片顯示不了