在以下来自Twitter Bootstrap的CSS中,“&”字符是什么意思?
.clearfix {
*zoom: 1;
&:before,
&:after {
display: table;
content: "";
}
&:after {
clear: both;
}
}
在以下来自Twitter Bootstrap的CSS中,“&”字符是什么意思?
.clearfix {
*zoom: 1;
&:before,
&:after {
display: table;
content: "";
}
&:after {
clear: both;
}
}
Answers:
嵌套&
选择SASS和LESS中的父元素。它不仅适用于伪元素,还可以与任何选择器一起使用。
例如
h1 {
&.class {
}
}
等效于:
h1.class {
}
这是一个SCSS / LESS示例:
a {
text-decoration: underline;
@include padding(15px);
display: inline-block;
& img {
padding-left: 7px;
margin-top: -4px;
}
}
及其等效的CSS:
a {
text-decoration: underline;
@include padding(15px);
display: inline-block;
}
a img {
padding-left: 7px;
margin-top: -4px;
}
&
是对父选择器的引用。