html - 我可以将LESS CSS标记应用于:hover伪选择器吗？

在LESS中，我可以应用两个规则来影响链接的文本样式以隐藏下划线，除非将其悬停:

.read-more
{
    a
    {
        text-decoration:none;
    }
    a:hover
    {
        text-decoration:hover;
    }
}

但是我觉得我也应该能够定义两个规则，例如:

.reverseHover
{
    text-decoration:none;
}

.reverseHover:hover
{
    text-decoration:hover;
}

然后使用mixin获取两个规则:

.read-more{
    a
    {
        .reverseHover;
    }
}

无需显式执行以下操作:

.read-more{
    a{
        .reverseHover;
    }
    a.reverseHover:hover
    {
        .reverseHover;
    }
}

那可能吗？

最佳答案

您可以使用&引用父选择器。您甚至可以在混合中使用父选择器。可在lesscss.org找到文档。下面是解决方案。

.reverseHover {
    text-decoration:none;
    &:hover { text-decoration:underline; }
}
.read-more
{
    a
    {
        .reverseHover
    }
}

关于html - 我可以将LESS CSS标记应用于:hover伪选择器吗？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8491835/