Pull to refresh

Значение CSS-свойства «content» в UNICODE

Reading time1 min
Views1.3K
CSS-свойство content крайне полезно. С помощью него, например, можно поставить запятую после каждого элемента списка: li:after { content: ','; }

Иногда необходимо задать значение этого свойства в виде набора символов UNICODE (чтобы не заботиться о совместимости кодировок, или в случае, если значение содержит перенос строки). Возникает вопрос, как получить набор символов UNICODE из строки?

Я предлагаю воспользоваться возможностями Javascript.



Итак, для одного символа наберите в адресной строке браузера (предварительно замените «,» на нужный вам символ):
javascript:alert('\\' + new String(',').charCodeAt(0).toString(16))

* This source code was highlighted with Source Code Highlighter.

Результат можно переностить в значение свойства «content»: li:after { content: '\2c'; }

Если строка длинная и вам лень набирать, то воспользуйтесь кодом ниже:
String.prototype.toCSSHex = function ()
{
  var text = this.toString();

  var result = '';
  var separator = '\\';

  for(var currentIndex = 0, length = text.length; currentIndex < length; currentIndex++)
  {
    result += separator + text.charCodeAt(currentIndex).toString(16);
  }

  return result;
}

var test = 'Привет, ребята!';
alert(test.toCSSHex())
;

* This source code was highlighted with Source Code Highlighter.
Tags:
Hubs:
Total votes 7: ↑4 and ↓3+1
Comments8

Articles