问多个类之间的一个共享选择器
EN

Stack Overflow用户

提问于 2022-03-25 12:41:49

回答 1查看 22关注 0票数 0

如何将相同的焦点状态应用于多个不同的类？

问题：

.btn {
 &.error {
   border-color: red;
 }

 &.primary {
   border-color: green;
 }

 &:focus {
   border-color: blue; 
   // this is not applied but i don't want to 
   // declare the same style to both classes 
 }
}

我知道这是一个选择，但这也不是最漂亮的选择，因为我需要在这里分别列出它们。

.btn {
 &.error {
   border-color: red;
 }

 &.primary {
   border-color: green;
 }

 &.primary:focus, &.error:focus {
   border-color: blue; 
 }
}

有什么更好的方法吗？

sass

回答 1

Stack Overflow用户

发布于 2022-03-27 12:42:01

在嵌套规则中再次使用&是一个很好的方法。

.btn {
    &.error {
        border-color: red;
    }
    
    &.primary {
        border-color: green;
    }
    
    &.primary, &.error {
        &:focus{
            border-color: blue; 
        }
    }
}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/71617189

复制

相似问题

问多个类之间的一个共享选择器
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问多个类之间的一个共享选择器EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问多个类之间的一个共享选择器
EN