МЕНЬШЕ передачи аргументов в Mixins

Question

Я немного новичок в LESS, поэтому я пытаюсь понять, как передать аргумент в Mixin, например, у меня есть:

@delay: 6s; 
.animation-delay (@delay) { 
    -webkit-animation-delay: @delay; 
    -moz-animation-delay: @delay; 
    -o-animation-delay: @delay; 
    -ms-animation-delay: @delay; 
    animation-delay: @delay; 
} 

, а затем на моей таблице стилей я хочу что-то вроде этого:

.slideshow li:nth-child(2) span { 
    background-image: url(/static/template/slides/slide-2.jpg) 
    .animation-delay(@delay); 
} 
.slideshow li:nth-child(3) span { 
    background-image: url(/static/template/slides/slide-3.jpg); 
    .animation-delay (@delay + 6); 
} 

Как я получаю ошибки от less.js Я предполагаю, что я не делаю этого правильно!

Answer 1

Меньше - это язык динамического стиля, который может быть скомпилирован в каскадные таблицы стилей (CSS) и запускаться на стороне клиента или на стороне сервера. Другими словами, это препроцессор CSS, который компилирует javascript-код в правила CSS.

Every CSS code is a valid LESS code, but not vice versa.

Вы не можете ожидать, что CSS будет распознавать @delay переменную и ее значение. Все, что вы хотите делать с правилами CSS, вы делаете это внутри файла .less.