LESS css задает динамическое фоновое изображение с mixin

Я использую LESS CSS.

В настоящее время я использую Mixins с переменными.

Что-то вроде этого работает нормально:

.border-radius (@radius) { border-radius: @radius; }

#header { .border-radius(4px);  }

Это not:

.bg-img(@img) { background-image:url(@img); }

#logo { .bg-img("../images/logo.jpg"); }

Я попробовал комбинации использования "и" в фоновом изображении: url ('') и ( "), но затем он пытается получить изображение как images/@img вместо имя изображения. Иными словами, это дает мне ошибку
Cannot call method 'charAt' of undefined

Я думаю, что писать background-image:url() все время слишком утомительно, возможно ли это.?

Ответ 1

:) получил мой ответ!

его нужно использовать как в моем случае:

.bg-img(@img) { background-image:url("@{img}"); }

#logo { .bg-img("../images/logo.jpg"); }

Ответ 2

Вы можете улучшить это, добавив первую часть пути к исходному микшированию, поэтому вам нужно только один раз написать его:

.bg-img(@img) { background-image:url("../images/@{img}"); }

#logo { .bg-img("logo.jpg"); }

Небольшое улучшение, но добавляет немного элегантности.