less.css: ссылаться на другие определения стиля?

#css #less

#css #Меньше

Вопрос:

Возможно ли ссылаться на другие определения стиля? Например, если у меня есть btn стиль, подобный этому:

 .btn {
    width: 150px;
}
  

Можно ли ссылаться на .btn ‘s width где-нибудь еще? Например, что-то вроде:

 #right_of_buttons {
    left: @{.btn.width} * 3; // ie, instead of hard-coding 150px * 3
}
  

Я знаю, что это можно сделать, определив переменную:

 @btn_width: 150px;
.btn { width: @btn_width }
  

Но я бы предпочел не делать этого, если мне это не нужно.

Ответ №1:

Если я не ошибаюсь, в оригинале LESS вы могли бы ссылаться на свойства определенного селектора:

 #right_of_buttons {
  left: .btn[width] * 3;
}
  

Но это было удалено в версии .js. Вместо этого вы можете просто использовать переменную:

 @btnwidth: 150px;
.btn {
  width: @btnwidth;
}
#sidebar {
  left: @btnwidth * 3;
}
  

Ответ №2:

Непроверенный, но, согласно документации, вы можете включить javascript напрямую, поэтому

 #right_of_buttons {
   left: `document.getElementsByClassName('.btn')[0].style.width`
}
  

Но на данный момент я не уверен, какую экономию вы получите, просто используя переменную.

Комментарии:

1. ReferenceError: document is not defined . Это выполняется под Node.js не в браузере, поэтому window и document нет.