Aplicación de un bloque de código para pseudoclases en LESS
Hagamos una función que establezca
los estilos de un enlace en estado hover.
Dejemos que esta función acepte un bloque de código como parámetro:
.hover(@code) {
}
Mostremos el bloque de código pasado dentro
del estado hover:
.hover(@code) {
&:hover {
@code();
}
}
Usemos nuestra función dentro del enlace:
a {
color: red;
.hover({
color: blue;
text-decoration: none;
});
}
Resultado de la compilación:
a {
color: red;
}
a:hover {
color: blue;
text-decoration: none;
}
Crea una función similar que
establezca los estilos para un campo de entrada en estado focus.