以下是一个示例代码,用于实现标签颜色不改变的功能:
HTML代码:
标签1
标签2
标签3
CSS代码:
.label {
background-color: yellow;
display: inline-block;
padding: 5px;
margin: 5px;
}
.label:hover {
background-color: yellow; /* 鼠标悬停时保持颜色不变 */
}
在上述代码中,.label
类定义了标签的样式,包括背景颜色、内边距和外边距。.label:hover
类定义了鼠标悬停时标签的样式,这里将背景颜色设置为与普通状态相同,以保持颜色不变。
通过使用:hover
伪类选择器,当鼠标悬停在标签上时,样式会发生变化,而当鼠标移开时,样式会恢复到初始状态,从而实现标签颜色不改变的效果。
上一篇:标签样式不响应CSS