Kódblokk alkalmazása pszeudoosztályokhoz LESS-ben
Készítsünk egy függvényt, amely beállítja
a link stílusát a hover állapotban.
Legyen ennek a függvénynek a paramétere egy kódblokk:
.hover(@code) {
}
Jelenítsük meg az átadott kódblokkot a
hover állapoton belül:
.hover(@code) {
&:hover {
@code();
}
}
Használjuk a függvényünket egy linken belül:
a {
color: red;
.hover({
color: blue;
text-decoration: none;
});
}
A fordítás eredménye:
a {
color: red;
}
a:hover {
color: blue;
text-decoration: none;
}
Készítsen egy hasonló függvényt, amely
beállítja a stílusokat egy input mező számára a focus állapotban.
