FAQ: CSS character encoding declarations

Question

Answer

To set the character encoding you may use the @charset "at-rule". Its syntax is:

@charset "<IANA defined charset name>";

For style declarations embedded in a document, @charset rules are not needed and must not be used. These rules are for use in linked style sheets.

Only one @charset rule may appear in an external style sheet and it must appear at the very start of the document. It must not be preceded by any characters, not even comments.

The name must be a charset name as described in the IANA registry. (See also the complete list of charsets). For example to label your CSS file as UTF-8 encoded you would write:

@charset "UTF-8";

By the way

It is also possible to specify the encoding of a CSS file by setting the server to send the information in the HTTP header (See CSS 2.1 Specification, section 4.4 CSS document representation). In this case, the encoding declaration of the HTTP header takes precedence over the @charset declaration inside the file. Whether or not you have used the HTTP header, you should still explicitly declare the character encoding inside the style sheet file (in the same way as you should for an HTML file). That way it is not left to chance as to how the style sheet's encoding will be interpreted - especially if the file is moved.

Character encoding information is, of course, always important if your CSS selectors reference element names, attribute names, or attribute values that are in non-ASCII text. Also, if you have non-ASCII values for such CSS properties as content or font-family you should be sure to declare the character encoding.