CSS@charset at-規則 は、スタイルシートで使う文字エンコーディングを定義します。この規則はスタイルシートの最初の要素でなければならず、これより前には文字を一切記述してはいけません。入れ子の文 でないとしても、条件付きグループ規則 では使えません。複数の @charset at-規則が定義されると、最初のものだけが使われます。HTML 要素の style 属性や、HTML ページの文字セットが関係している <style> 要素の中では使えません。

@charset "utf-8";

この at-規則は、content のような CSS プロパティで非 ASCII 文字を使う際に便利です。

スタイルシートの文字エンコーディングを定義する方法は複数あるので、ブラウザは次の手順を順番に試します (そして 1 つでも結果が得られると止めます):

  1. ファイル先頭にある Unicode byte-order 文字 (BOM) の値
  2. Content-Type: HTTP ヘッダーの charset 属性、またはスタイルシートを送るのに使われたプロトコル内の同等のものから、得られた値
  3. CSS の @charset at-規則
  4. 文書参照で定義されている文字エンコーディングを使用。<link> 要素の charset 属性です。この方式は HTML5 で廃止されており、使うべきではありません。
  5. 文書が UTF-8 だと仮定する

構文

@charset "UTF-8";
@charset "iso-8859-15";

ここでは:

charset
使う文字エンコーディングを意味する <string> です。IANA-registry で定義されているウェブセーフな文字エンコーディングの名前でなければなりません。この名前は必ず 1 文字分の空白文字 (U+0020) の後に続き、二重引用符で囲われ、セミコロン記号で終わる必要があります。もし 1 つのエンコーディングに複数の名前が関連付けられている場合には、preferred とマークされているものだけが使われる必要があります。

正式な構文

@charset "<charset>";

@charset "UTF-8";       /* スタイルシートのエンコーディングを Unicode UTF-8 にします*/
@charset 'iso-8859-15'; /* 無効です。正しくない引用符が使用されています */
 @charset "UTF-8";      /* 無効です。at-規則より前に文字(空白)があります */
@charset UTF-8;         /* 無効です。' か " がなく、文字セットは CSS の <string> ではありません */

仕様

仕様書 策定状況 コメント
CSS Level 2 (Revision 1)
@charset の定義
勧告 Initial definition

ブラウザーの実装状況

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
@charsetChrome 完全対応 2Edge 未対応 なしFirefox 完全対応 1.5
補足
完全対応 1.5
補足
補足 Firefox 1 supported an invalid syntax where the character encoding is not between single or double quotes.
IE 完全対応 5.5
補足
完全対応 5.5
補足
補足 From Internet Explorer 5.5 to IE 7 (inclusive), Internet Explorer supported an invalid syntax where the character encoding is not between single or double quotes.
Opera 完全対応 9Safari 完全対応 4WebView Android 完全対応 2Chrome Android 完全対応 18Edge Mobile 未対応 なしFirefox Android 完全対応 4Opera Android 完全対応 10.1Safari iOS 完全対応 4Samsung Internet Android ?

凡例

完全対応  
完全対応
未対応  
未対応
実装状況不明  
実装状況不明
実装ノートを参照してください。
実装ノートを参照してください。

ドキュメントのタグと貢献者

最終更新者: mdnwebdocs-bot,