在CSS或SASS中`&#my- in‘是什么意思？
在CSS或SASS中`&#my- in‘是什么意思？
提问于 2018-08-11 02:44:07
我继承了一些CSS代码，它在id名称之前使用&字符来样式化它。它看起来像这样：
&#my-id {
// Content and attributes
}它也有其他实例，例如：
&:before {
// content and attributes
}和
&:hover {
// content and attributes
}这些是什么意思？我找不到在搜索中表达这一点的好方法，所以我找不到任何东西。如果这是一个复制品，我很抱歉。
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-08-11 02:46:05
它引用父选择器。
输入：
.parent {
&.child {
color: red;
}
}输出：
.parent.child { color: red }如果你正在编写BEM格式的CSS，这真的很有帮助，比如：
.block {
&__element {
width: 100px;
height: 100px;
&--modifier {
width: 200px;
}
}
}
.block__element { width: 100px; height: 100px;}
.block__element--modifier { width: 200px;}
<div class="block__element"></div>
<div class="block__element block__element--modifier"></div>最后，我分享的所有示例都连接了类名，但您也可以将其用作引用，例如：
.parent {
& .child {
color: red;
}
}
.parent {
.child & {
color: blue;
}
}
.parent .child { color: red }
.child .parent { color: blue }其他参考资料：
http://lesscss.org/features/#parent-selectors-feature
https://blog.slaks.net/2013-09-29/less-css-secrets-of-the-ampersand/
Using the ampersand (SASS parent selector) inside nested selectors
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51792403
复制相关文章
相似问题
腾讯云开发者
