堆叠伪类语法？

Question

我一直在网上搜索大约一个小时，但是，我似乎只找到了“一般”教程。

如果我有像

这样的CSS代码，我就有

.foo {
   border-color: #ff000;
}

.foo:hover {
   border-color: #0000ff;
}

我可以把它变成一个类似于类的元素吗？下面是一个想法的演示，我不知道是否可能。

.foo {
   border-color: #ff0000;
   border-color-hover: #0000ff;
}

Answer 1

不，你不能这样做，你必须将它分成:hover类，就像你的第一个例子一样。

Answer 2

对于你想要完成的事情，你不会使用vanilla CSS。您可以查看SASS/SCSS或LESS。

LESS会让你这样做：

foo { 
    border-color: #ff0000;
    &:hover { border-color: #0000ff; }
}

Answer 3

不，这是不可能的。为什么会这样？你的第一个例子很好。