css - 较少的悬停和事件状态

Question

您能否在 [less] 中将事件状态添加到与悬停状态相同的行上，还是必须嵌套在单独的行中？

例子:

标准较少

nav {
    color:@black;
    display:block;
    &:hover {color:@primary-color;}
    &:active {color:@primary-color;}    
}

以某种方式做到这一点

nav {
    color:@black;
    display:block;
    &:hover, &:active {color:@primary-color;}    
}

我试过:[&:hover, &:active;] 我试过:[&:hover; &:active;] 但它似乎不起作用。

Answer 1

实际上是的，只要您定义了 @primary-color 变量，您提供的第二个变量就是正确的:

@primary-color: #f00;
@black: #000;

nav {
  color: @black;
  display:block;
  &:hover, &:active {color:@primary-color;}    
}

将产生:

nav {
  color: #000000;
  display: block;
}
nav:hover,
nav:active {
  color: #ff0000;
}