在scss中如何使用hover(Vue项目)
最近在Vue项目中,想实现在鼠标悬浮时,修改鼠标指向的模块样式,但使用的是scss,写法是什么样的呢?
效果图:
实现代码:
.content {
width: 100px;
height: 25px;
margin: 10px;
font-size: 16px;
text-align: left;
color: rgba($color: #5e5959, $alpha: 0.8);
// 样式:
&:hover {
opacity: 1;
color: rgb(73, 88, 232);
text-decoration: underline;
}
}
content样式是包含文本样式的dom标签,&:hover表示悬浮时的样式,这里是将悬浮时的样式修改为蓝色,并且添加文字下划线