CSS: после кодирования символов в контенте

Question

Я использую следующий CSS, который, кажется, работает:

a.up:after{content: " ↓";}
a.down:after{content: " ↑";}    

Символы, тем не менее, не могут быть закодированы так, поскольку выходные данные являются буквальными и показывают фактическую строку:

a.up:after{content: " ↓";}
a.down:after{content: " ↑";}   

Если я не могу закодировать его, мне кажется, что я должен использовать что-то вроде .append () в jQuery, так как это поддерживает кодирование.Есть идеи?

Answer 1

Чтобы использовать закодированные символы Unicode в content, вам необходимо предоставить либо сами символы (как вы делаете), либо их escape-последовательности UTF-8 вместо сущностей HTML:

a.up:after { content: " \2193"; }
a.down:after { content: " \2191"; }   

Answer 2

Почему вы хотите закодировать эти символы в любом случае? Помните, что вы пишете CSS, а не HTML. Ваш код:

a.up:after{content: " ↓";}
a.down:after{content: " ↑";}

совершенно правильно, если вы сохраняете файл в кодировке UTF-8 и отправляете соответствующий заголовок:

Content-Type: text/css; charset=utf-8

Кодирование символов используется только в HTML, чтобы не было двусмысленности между контентом и тегами. Таким образом, вы бы закодировали < как <, чтобы браузер не думал, что это начало тега. Такие вещи, как ↓ - это просто товары для людей, которые не знают, как использовать utf-8 (или не могут по какой-либо причине)