Тень текста с помощью переменной CSS - PullRequest
Новая
       103

Тень текста с помощью переменной CSS

0 голосов
/ 27 февраля 2019

У меня проблема со свойством тени текста.

Это работает: 

text-shadow: 1px 1px 0 var(--primary-color);

Это не работает: 

text-shadow: 1px 1px 0 rgba(var(--primary-color), 0.5);

Кто-нибудь знает, чтопроблема?

Спасибо!

1 Ответ

0 голосов
/ 27 февраля 2019 
--primary-color: #f00;
text-shadow: 1px 1px 0 var(--primary-color);
text-shadow: 1px 1px 0 rgba(var(--primary-color), 0.5);

оценивается как 

text-shadow: 1px 1px 0 #f00;
text-shadow: 1px 1px 0 rgba(#f00, 0.5);

rgba(#f00, 0.5) не является допустимым цветом rgba.

Вместо этого вы можете сделать: 

:root {
  --primary-color: 255, 0, 0;
}

.opaque {
  text-shadow: 1px 1px 0 rgb(var(--primary-color));
}

.translucent {
  text-shadow: 1px 1px 0 rgba(var(--primary-color), 0.5);
}
<div class="opaque">Opaque</div>
<div class="translucent">Translucent</div>
...