Вопросы Теги

Директива Sass @if принимает несколько условных обозначений? [Дубликат]

Я думаю, что для этого есть очень простой / старый метод, который поддерживается всеми браузерами даже IE 6/7. Мы могли бы просто установить letter-spacing на большое отрицательное значение в родительском, а затем вернуть его к normal в дочерние элементы: 

body { font-size: 24px }
span { border: 1px solid #b0b0c0; } /* show borders to see spacing */

.no-spacing { letter-spacing: -1em; } /* could be a large negative value */
.no-spacing > * { letter-spacing: normal; } /* => back to normal spacing */
<p style="color:red">Wrong (default spacing):</p>

<div class="">
  <span>Item-1</span>
  <span>Item-2</span>
  <span>Item-3</span>
</div>

<hr/>

<p style="color:green">Correct (no-spacing):</p>

<div class="no-spacing">
  <span>Item-1</span>
  <span>Item-2</span>
  <span>Item-3</span>
</div>

45
задан Russ Ferri 21 June 2013 в 02:03
поделиться

2 ответа

Из справочной документации по языку Sass:

Логические операции

SassScript поддерживает and, or и not операторы для булевых значений.

(link)

Так выражение выражения if с составным условием будет выглядеть так: 

@if $var1 == value1 and $var2 == value2 {
    // ...
}

Кроме того, скобки могут использоваться для изменения порядка операций в более сложном выражении: 

@if ($var1 == value1 and not ($var2 == value2)) or ($var3 == value3) {
    // ...
}
89
ответ дан Russ Ferri 28 August 2018 в 04:03
поделиться

Вы также можете сделать: 

@if index("foo" "bar", $value) { .. }

Остерегайтесь:

  1. Возможно, не совсем очевидно, что вы пытаетесь сделать.
  2. Он возвращает число или null, а не boolean.
2
ответ дан Hugo Giraudel 28 August 2018 в 04:03
поделиться
Другие вопросы по тегам:

Похожие вопросы: