&使用问题

Question

老师，在写food-item中的extra样式时，您写选择器选择icon类时用了stylus的&符号，但我发现这样写，样式并没有加进去，反而是去掉&符号后margin样式才显出来；但前面有的地方去掉&符号，样式就不见了。我想问一下，什么时候该用&符号呢？

Answer 1

小感冒 2017-08-02 09:58:35

回复 慕粉1613479704：

1.能不能写和它等价的代码？：可以。比如上面我写的等价于那段代码。,但是既然使用了stylus，我们为什么还要去使用非stylus语法的写法呢？。

2.为什么有时候必须用&符号才行? : 不是必须。&符号说白了，就是父元素。 出现书写其他等价代码无效，请检查书写格式是否正确。

比如下面红色框起来的，使用了&符号，这样我们得到的效果就是,“ I am wrapper”和"text1文字" 变为了红色，"text2文字"没有变色，说明在这里 &就是等于.wrapper，也就是说的等于父元素。

当然，如果你不想使用 &符号,就需要这样写,达到的效果是一样的。

Answer 2

小感冒 2017-08-02 10:01:15

另外，我们可以拿课程中的一段css来验证，这是弹出购物车后显示的遮罩样式动画，&符号显示的写成.list-mask依旧是有效的。

• 提问者 xzxiang #1

  多谢了 兄弟

Answer 3

小感冒 2017-08-01 19:39:07

&指向父级选择器 ,例如

a 
 color: red
 &:hover
   color: yellow

就等于

a {
 color: red
}
a:hover {  
    color: #000;
}

• 提问者 xzxiang #1

  兄弟 谢谢哈 但我搞不懂的是为什么有时候必须用&符号才行 而不能写和它等价的代码