Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Allowed characters in CSS 'content' property?

Tags:

css

unicode

I've read that we must use Unicode values inside the content CSS property i.e. \ followed by the special character's hexadecimal number.

But what characters, other than alphanumerics, are actually allowed to be placed as is in the value of content property? (Google has no clue, hence the question.)

like image 585
its_me Avatar asked Mar 26 '13 17:03

its_me


2 Answers

As far as I know, you can insert any Unicode character. (Here's a useful list of Unicode characters and their codes.)

To utilize these codes, you must escape them, like so:

U+27BA Becomes \27BA

Or, alternatively, I think you may just be able to escape the character itself:

content: '\➺';

Source: http://mathiasbynens.be/notes/css-escapes

like image 123
Bill Avatar answered Oct 14 '22 20:10

Bill


The rules for “escaping” characters are in the CSS 2.1 specification, clause 4.1.3 Characters and case. The special rules for quoted strings, as in content property value, are in clause 4.3.7 Strings. Within a quoted string, any character may appear as such, except for the character used to quote the string (" or '), a newline character, or a backslash character \.

The information that you must use \ escapes is thus wrong. You may use them, and may even need to use them if the character encoding of the document containing the style sheet does not let you enter all characters directly. But if the encoding is UTF-8, and is properly declared, then you can write content: '☺ Я Ω ⁴ ®'.

like image 39
Jukka K. Korpela Avatar answered Oct 14 '22 20:10

Jukka K. Korpela