Можно ли показать TextSelection со значком шрифта? - PullRequest
0 голосов
/ 08 октября 2019

Мне нужно использовать Font Awesome в редакторе WYSIWYG, и я хочу, чтобы пользователь мог выделить значок с выделением текста.

Я пытался user-select: all, но это не работает (Значок по-прежнему не помечается, когда я выделяю текст)

.select-text {
  user-select: all !important;
}

.select-text::selection {
  background: red !important;
}
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<p>
    <span class="select-text">Hello </span>
    <span class="fa fa-check select-text"></span>
    <span class="select-text"> World</span>
</p>

Возможно ли это?


Я нашел обходной путь, см. Ниже. Я все еще рад ответу о том, как сделать это без юникода с классом селектора :before fa-check. Это, вероятно, причина? Я попробовал:

.select-text:before::selection {
    background: red !important;
}
.select-text:before {
    user-select: element !important;
}

1 Ответ

1 голос
/ 08 октября 2019

Оказалось, что я могу использовать Cheatsheet и использовать Unicode (например, &#xf00c;) вместо класса.

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<p>
    <span class="fa">&#xf00c;</span>
</p>

Поскольку это обходной путь, я все еще рад ответу о том, как это сделать без юникода с селекторным классом :before fa-check.

...