Как оформить UTF стрелка & # 10148

Question

Я разместил стрелку UTF & # 10148 на моем сайте, и у меня есть два вопроса:

1. Как мне установить цвет?

2. Могу ли я повернуть его, чтобы он был стрелкой вверх? Я не вижу эквивалентного стиля стрелок вверх для & # 10148 в стрелках UTF.

Вот код, который я сейчас использую:

a.UTF_uparrow {
  font-size: 15pt;
  color: rgb(140, 173, 255);
}

<a href="#bkmkAA" class="UTF_uparrow" style="text-decoration: none">&#10148;</a>

Цвет по умолчанию всегда равен лососевому, независимо от того, какой цвет я выбираю в коде css, в отличие от других элементов страницы, и я хочу, чтобы он указывал вверх, не так.

Спасибо за любую помощь в этом.

Answer 1

Добавьте display:inline-block или block, затем transform:rotate(-90deg);.Цвет правильный ... Вы все еще видите цвет лосося на этой демонстрации?Если нет, тогда переопределите стиль, либо попытавшись !important (не рекомендуется), либо добавьте класс в цепочку для более высокой специфичности, например:

a.UTF_uparrow.UTF_uparrow.UTF_uparrow {...

a.UTF_uparrow {
  display: inline-block;
  font-size: 15pt;
  color: rgb(140, 173, 255);
  transform: rotate(-90deg);
}

a.small {
  font-size: 7pt;
}

<a href="#bkmkAA" class="UTF_uparrow" style="text-decoration: none">&#10148;</a>

<a href="#bkmkAA" class="UTF_uparrow small" style="text-decoration: none">&#10148;</a>

Answer 2

UTF-символы являются текстом, поэтому свойство color является правильным. Должно быть правило, применяющее цвет лосося с более высокой специфичностью .

Вы можете использовать Inspector в инструментах разработчика вашего браузера, чтобы найти, какое правило CSS переопределяет ваш a.UTF_uparrow селектор. Проверьте вкладку Computed , в которой перечислены все правила, которые применяются к выбранному элементу в порядке специфичности.

a.UTF_uparrow{
    font-size: 15pt;
    color: rgb(140,173,255);
}

<a href="#bkmkAA" class="UTF_uparrow" style="text-decoration: none">&#10148;</a>

Что касается поиска стрелки вверх, я бы порекомендовал вам найти соответствующий символ UTF, а не пытаться повернуть эту стрелку. Вы всегда можете попробовать иконку шрифта, если вам не нравится внешний вид каких-либо символов UTF. Следует также отметить, что символы UTF выглядят по-разному в зависимости от операционной системы пользователя, поэтому в любом случае вы не получите согласованного вида с ними.