uniapp中list的内容如何设置鼠标悬停显示样式
可以使用CSS的:hover伪类来设置鼠标悬停时的样式。例如,假设列表项的class为item,可以使用以下CSS代码来设置鼠标悬停时的背景色为灰色:
.item:hover {
background-color: #eee;
}
将这段代码放在全局样式文件中,即可应用到所有列表项。如果只想针对特定的列表项设置鼠标悬停样式,可以为该列表项添加一个特定的class,并在CSS中使用该class来设置样式。例如:
<template>
<ul>
<li class="item">列表项1</li>
<li class="item hover-item">列表项2</li>
<li class="item">列表项3</li>
</ul>
</template>
<style>
.hover-item:hover {
background-color: #eee;
}
</style>
在这个例子中,第二个列表项添加了一个名为hover-item的class,并在CSS中使用该class来设置鼠标悬停样式。
原文地址: https://www.cveoy.top/t/topic/w7D 著作权归作者所有。请勿转载和采集!