@charset

概要

CSSファイルの文字エンコーディングを明示的に指定するアットルールです。UTF-8 以外のエンコーディングで保存されたスタイルシートで日本語などの非ASCII文字を正しく解釈させるために使用します。ファイルの先頭に記述する必要があります。現在はほとんどの場合 UTF-8 が標準のため、明示的な指定が不要なケースが大半です。

対応ブラウザ

基本構文

@charset "UTF-8";

body {
  font-family: sans-serif;
}

実務での使いどころ

• 非UTF-8スタイルシートのエンコーディング宣言

  UTF-8以外のエンコーディングで保存されたCSSファイルが正しく解釈されるよう、文字セットを明示的に宣言できます。

注意点

アクセシビリティ

• 正しいエンコーディング宣言により、日本語などの多言語テキストが正しく表示され、すべてのユーザーがコンテンツを正しく読めるようになります。

参考リンク

• MDN Web Docs — @charset