CODEWITHSUNDEEP
unicodecss
its_me
its_me

Reputation: 11338

Allowed characters in CSS 'content' property?

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.)

Upvotes: 13

Views: 14398

Answers (2)

Bill
Bill

Reputation: 3517

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

Upvotes: 4

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201538

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: '☺ Я Ω ⁴ ®'.

Upvotes: 13

Related Questions