:hover伪类用于在用户将鼠标悬停在元素上时应用样式。当鼠标悬停在元素上时,您可以css更改元素的颜色、背景、边框等属性,以提供一种交互效果。
以下是:hover伪类的基本用法:
selector:hover {
/* 在鼠标悬停时应用的样式 */
}
其中,selector是您要应用:hover样式的元素的选择器。您可以使用标签名、类名、ID等选择器来指定要应用样式的元素。
以下是一个示例,当鼠标悬停在一个按钮上时,改变按钮的背景颜色和文本颜色:
.button:hover {background-color: blue;color: white;}
在上面的示例中,我们使用.button类选择器来选中按钮元素,并在:hover伪类下应用样式。当鼠标悬停在按钮上时,按钮的背景颜色将变为蓝色,文本颜色将变为白色。