Slashes (`/`) в значениях CSS при использовании меньше (например, в `font`)

StackOverflow https://stackoverflow.com/questions/3090340

  •  29-09-2019
  •  | 
  •  

Вопрос

Я заметил проблему, используя меньше с помощью шрифта

.font(@weight: 300, @size: 22px, @height: 32px) {
    font: @weight @size/@height "Helvetica Neue", Arial, "Liberation Sans", FreeSans, sans-serif;
}

Вышеуказанное не удалось с

this.a.toCSS is not a function
http://localhost/tumblr/modern1/css/style.less on line 1, column 0:
1. @highlight: #cb1e16;
2. @shade1: #cb1e16;

Когда я разделяю свойства, он работает

.font(@weight: 300, @size: 22px, @height: 32px) {
  font-weight: @weight;
  font-size: @size;
  line-height: @height;
  font-family: "Yanone Kaffeesatz", "Helvetica Neue", Arial, "Liberation Sans", FreeSans, sans-serif;

}

Я думаю, что это из-за сом / вот, что вызывает проблему, я думаю, что с меньшего размера могут делать расчеты, например,. 2px + 5 = 7px Это пытается сделать разрыв?

Это было полезно?

Решение

Просто пробежал в эту проблему, функция побега (в любом случае для ite.js): E (), как это 

font: @weight @size e('/') @height "Helvetica Neue", Arial, "Liberation Sans", FreeSans, sans-serif;

Другие советы

Передняя слешь / Персонаж вызывает меньше компилятора, чтобы разделить размер шрифта на вашу высоту строки. Ты сможешь:

  1. Разделите свои CSS в некрастящиеся, отдельные правила

    Размер шрифта: @size; Высота линии: @height;

  2. Избежать некоторых или всех ваших меньшего количества шрифта. Слешь / Сама - лучшая часть, чтобы убежать. Вы можете использовать E, e("/") Убегайте синтаксис или новее, лучше документированные тильды-цитаты ~"/". Отказ Вы также можете использовать менее строковую интерполяцию @{} Синтаксис для вставки ваших переменных.

Попробуй это:

font: @weight @size~"/"@height "Helvetica Neue", Arial, "Liberation Sans", FreeSans, sans-serif;

Или это:

font: @weight ~"@{size}/@{height}" "Helvetica Neue", Arial, "Liberation Sans", FreeSans, sans-serif;

Менее 1,4 и выше сейчас есть опция «Strictmath», которая решает двусмысленность между и шрифтом STONDHAND. В 1.4 по умолчанию он отключен для облегчения перехода, но в более поздних версиях он будет включен по умолчанию.

Увидеть 1.4 Примечания здесь

Когда strictmath включен, все математические операции должны быть завернуты в скобки (10px / 5px) И передняя слешь в шрифте коротко не будет интерпретироваться как разделение.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top