sitios - ¿Qué significa un "y" antes de un pseudo elemento en CSS?
que es la accesibilidad web universal (3)
Eso es MENOS , no CSS.
Esta sintaxis le permite anidar modificadores de selector de nido.
.clearfix {
&:before {
content: '''';
}
}
Compilará a:
.clearfix:before {
content: '''';
}
Con el .clearfix:before
&
, los selectores anidados se compilan para .clearfix:before
.
Sin él, se compilan para .clearfix :before
.
En el siguiente CSS tomado de Twitter Bootstrap, ¿qué significa el carácter ampersand (&)?
.clearfix {
*zoom: 1;
&:before,
&:after {
display: table;
content: "";
}
&:after {
clear: both;
}
}
Un anidado &
selecciona el elemento padre tanto en SASS como en LESS. No es solo para pseudo elementos, se puede usar con cualquier tipo de selector.
p.ej
h1 {
&.class {
}
}
es equivalente a:
h1.class {
}
In SCSS & LESS
a {
text-decoration: underline;
@include padding(15px);
display: inline-block;
& img {
padding-left: 7px;
margin-top: -4px;
}
}
is Equal to in CSS :
a {
text-decoration: underline;
@include padding(15px);
display: inline-block;
}
a img {
padding-left: 7px;
margin-top: -4px;
}