在CSS中,:hover
伪类选择器适用于所有元素,包括元素、伪元素和SVG元素。这意味着你可以使用:hover
来改变鼠标悬停在页面上的任何元素时的样式。
以下是一些使用:hover
的示例:
- 改变链接的颜色:
a:hover { color: red; }
- 改变按钮的背景颜色:
button:hover { background-color: blue; }
- 改变列表项的样式:
li:hover { background-color: yellow; }
- 改变图像的透明度:
img:hover { opacity: 0.5; }
需要注意的是,:hover
只会在用户将鼠标悬停在元素上时应用样式。一旦鼠标离开,样式将恢复为默认值(除非你在CSS中明确指定了其他样式)。