首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Less中“与”和“双”“与”的区别是什么?

Less中“与”和“双”“与”的区别是什么?
EN

Stack Overflow用户
提问于 2019-03-05 01:34:01
回答 3查看 900关注 0票数 1

我正在尝试在React的上下文中少写一些。

下面的代码可以工作:

代码语言:javascript
复制
.rt-tr-group .rt-tr:hover .rt-td {
    color: #fff;

    &:first-child { /* notice single ampersand */
        border-left: 2px solid #007aff;
    }
}

这段代码也可以工作:

代码语言:javascript
复制
.rt-tr-group .rt-tr:hover .rt-td {
    color: #fff;
}
.rt-tr-group .rt-tr:hover .rt-td:first-child {
    border-left: 2px solid #007aff;
}

但是,以下代码不起作用:

代码语言:javascript
复制
.rt-tr-group .rt-tr:hover .rt-td {
    color: #fff;

    &&:first-child { /* notice double ampersand */
        border-left: 2px solid #007aff;
    }
}

我已经在代码库的其他地方看到使用了双和号,所以&&做了一些事情。有人能给我解释一下其中的区别吗?

EN

回答 3

Stack Overflow用户

发布于 2019-03-05 01:38:48

您看到的两个“与”符号可能是& + && ~ &,而不是&&,就我所知,后者在Sass中什么也不做。

使用& + &将允许您针对同一选择器的相邻同级,例如以下SCSS:

代码语言:javascript
复制
.btn {
  ...
  & + & {
    margin-left: 15px;
    background: firebrick;
  }
}

...will编译成这个CSS:

代码语言:javascript
复制
.btn {
  ...
}
.btn + .btn {
  margin-left: 15px;
  background: firebrick;
}

阅读更多关于双与号here at Team Treehouse的信息。

票数 2
EN

Stack Overflow用户

发布于 2019-03-05 01:46:27

在几乎所有流行的编程语言中,&&对于基本逻辑运算符AND来说都是多余的,而单一的&专门用于在SASS中连接CSS选择器。

连接,或者更准确地说,在SASS的用例中:连接选择器在逻辑意义上与组合两个条件非常不同。

进一步阅读:https://www.sitepoint.com/sass-basics-operators/https://javascript.info/logical-operators

票数 1
EN

Stack Overflow用户

发布于 2019-03-05 01:48:03

这可能是为了增加特异性:.thing.thing.thing更高

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

https://stackoverflow.com/questions/54988593

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档