色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css 鼠標經過加載圖片

李中冰1年前8瀏覽0評論

CSS中可以通過:hover偽類選擇器來實現鼠標經過加載圖片的效果。

首先,需要在HTML中添加顯示圖片的標簽以及對應的CSS樣式。例如,給這個標簽添加一個類名為“hover-image”的樣式:

然后,在CSS中定義該類名的樣式:

.hover-image {
width: 200px;
height: 200px;
background-image: url(hover.jpg);
background-size: cover;
opacity: 0.5;
transition: opacity 0.5s;
}

以上代碼表示鼠標經過該標簽時,顯示的圖片將會變為“hover.jpg”,并且會有一個0.5秒的漸變動畫效果。

接下來,需要定義鼠標經過該標簽時顯示的樣式。使用:hover偽類選擇器即可。

.hover-image:hover {
opacity: 1;
}

以上代碼表示當鼠標經過該標簽時,將會顯示完全不透明的圖片。

通過以上CSS代碼,就可以實現鼠標經過加載圖片的效果了。