Skip to: content, navigation

by Tommy Olsson and Paul O’Brien

@charset

Browser support full matrix
IE5.5+ FF1.5+ Saf3 Op9.2+
Buggy Full None Full
Spec
Version
CSS2

Example

This example indicates that the style sheet will use the ISO-8859-15 character encoding:

@charset "ISO-8859-15";

Description

We use the @charset at-rule to specify the character encoding of an external style sheet. The at-rule must be followed by a quoted string value and a semicolon; the string must contain a valid encoding name from the IANA registry.

For obvious reasons, if it’s present, an @charset rule must be the very first thing in the CSS file. The only item that can precede it is a Unicode byte order mark (BOM).

You’ll rarely need to use an @charset rule in your style sheets. A user agent can deduce the character encoding of a CSS style sheet in four different ways, and if all of those fail, it uses a default.

For an external style sheet, a user agent will look for the following items:

  • a charset attribute in a Content-Type HTTP header (or similar) sent by the web server
  • a Unicode byte order mark, or an @charset at-rule
  • a charset attribute specified in the <link> tag from which the HTML document links to the style sheet
  • the encoding of the referring document or style sheet

This list defines the items in order of descending priority, and the first one that’s found will determine the style sheet’s encoding. If none are found, the user agent will assume the character encoding is UTF-8.

Using Special Characters

You can refer to characters that can’t be represented by the style sheet’s encoding using CSS escape notation.

Compatibility

IE5.5Buggy
6.0Buggy
7.0Buggy
Firefox1.0Buggy
1.5Full
2.0Full
Safari1.3None
2.0None
3.0None
Opera9.2Full
9.5Full

In Internet Explorer versions up to and including 7, an @charset rule will not fail if the encoding is specified without quotes, even though it should.

In Firefox 1.0, an @charset rule will work only if it’s specified without quotes, on which it should actually fail.

Related Reading

User-contributed notes

There are no comments yet.

Add a note

To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.

Related Products

The Principles of Beautiful Web Design

Best Seller!

You don’t need to go to Art School to design great looking web sites!

Book Cover: The Principles of Beautiful Web Design

Download the FREE sample chapters