Применение блока кода для псевдоклассов в LESS
Давайте сделаем функцию, которая будет задавать
стили ссылки в состоянии hover
.
Пусть эта функция параметром принимает блок кода:
.hover(@code) {
}
Давайте выведем переданный блок кода внутри
состояния hover
:
.hover(@code) {
&:hover {
@code();
}
}
Воспользуемся нашей фукцией внутри ссылки:
a {
color: red;
.hover({
color: blue;
text-decoration: none;
});
}
Результат компиляции:
a {
color: red;
}
a:hover {
color: blue;
text-decoration: none;
}
Сделайте аналогичную функцию, которая будет
задавать стили для инпута в состоянии focus
.