Html 在初始规则集中包含伪类样式

我正在用自己的规则集设计.button1类的样式。此外，我使用CSS选择器为：hover伪类提供了一个单独的规则集。button1:hover

但我希望在现有的.button1规则集中定义：hover伪类样式

目前： 渴望的： 有可能这样做吗

---

这里是链接这里是一个获得悬停效果的示例-

<style>
    .btn{
        /* Style your button */
    }
    .btn:hover{
        /* Add hovering effect to your button */
    }
</style>
<button class="btn">Green</button>

---

如果要将鼠标悬停添加到任何类，则格式为 不能将其添加到.button类中

.button1:hover{
   background-color: #4CAF50;
}

CSS 这在纯CSS中是不可能做到的：

.button1和.button1:hover是不同的CSS选择器

使用CSS时，如果要对悬停状态应用唯一样式，则必须有单独的规则集：

.button1 { background: red; }
.button1:hover { background: pink; }

CSS预处理器 然而，有一些CSS预处理器允许我们使用特殊的语法编写样式规则，这些语法允许嵌套类似于您希望完成的内容

例如，以下是Sass预处理器使用的SCSS语法：

.button1 {
    background: red;

    &:hover {
        background: pink;
    }
}

这些中间语法本身不会在浏览器中运行，因此最终，必须使用一个特殊的解释器预处理器来处理特殊语法并将其转换为浏览器可以实际加载的真正CSS

一些流行的预处理器：

---

你说你想把鼠标悬停在元素的标签里，作为一个属性？请解释到目前为止你想要实现的目标。你正在做正确的css以获得悬停效果。我更新了问题。抱歉，但我们无法理解问题是什么requirement@SaurabhKumarSingh看到我下面的答案了吗？我想他是在问他是否可以把：在课堂里盘旋。。。对一些人来说reason@ScottChambers对scott@SaurabhKumarSingh但是为什么？根据他的评论尝试使用transitionOr如果你使用类似的按钮如确认按钮，那么你可以定义一个类。btn cnf并在同一个类中添加悬停和样式，如。btn cnf:hover not like。button1，。button2等。谢谢你，我们使用的是SCS，我应该在我的报告中提到这一点question@SaurabhKumarSingh没问题！注意特殊的&字符。它是一个特殊的占位符，在嵌套规则中用于表示来自父级的css选择器。因此&:hover相当于.button1:hover，因为在这种情况下，父选择器是.button1。

.button1 { background: red; }
.button1:hover { background: pink; }

.button1 {
    background: red;

    &:hover {
        background: pink;
    }
}