Expand All | Collapse All

CSS @charset rule

Topic: CSS3 Properties ReferencePrev|Next


A single @charset rule can be used in an external sheet to specify the character encoding of the style rules and values.

The @charset rule should never be used in an embedded style sheet, as there are other ways to define character encoding in HTML such as <meta> tag.


The syntax of this at-rule is given with:

@charset "charset-name";

The example below shows the @charset property in action.

@charset "UTF-8";
/* CSS Document */
body {
    background: yellow;
h1 {
    color: #ff0000;
    font-size: 24px;
p {
    color: rgb(0,255,0);
    font-size: 14px;

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

Browser Compatibility

The @charset rule is supported in all major modern browsers.

Browsers Icon

Basic Support—

  • Firefox 1.5+
  • Google Chrome 2+
  • Internet Explorer 5.5+
  • Apple Safari 4+
  • Opera 9+

Further Reading

See tutorial on: HTML Meta.

Bootstrap UI Design Templates Property Marvels - A Leading Real Estate Portal for Premium Properties