アットルール（@規則）は、セレクタ（selector）とプロパティだけでは指定できない機能を補うために用意されています。アットルール（@規則）は、@キーワードとそれに続く部分から成ります。@キーワードとは、アットマーク（@）から始まって、次に識別子と呼ばれる文字列が続くものです。識別子には、CSS2 では、import, charset, media, font-face, page の5つが定義されています。つまり、@importルール, @charsetルール, @mediaルール, @font-faceルール, @pageルールの 5つがあります（本文書では、今後の視覚ブラウザの対応の見込みがなく、CSS2.1 では削除予定の @font-faceルールの解説は扱いません）。
@import url(xxx.css); @import "xxx.css";
@importルールの書式には 2通りあります。最新の視覚ブラウザは、どちらの書式にも対応しています。 @importルールは、スタイルシートのリストの記述が長くなった場合に、複数にわけて整理することで編集を容易にする場合などに有用です。@import に続いて、「url( ～ )」で、CSSファイルの所在を、URI で指定します。URI は、相対URI、または絶対URI で指定します。最後に、セミコロン（;）を記述します。スタイルシートのファイルの中だけでなく、style要素の中でも外部のスタイルシートファイルを取り込むために使うことができます。その際に、@importルールは必ず、一番最初に記述する必要があります。
@import url(main.css);
@import url(sub.css);
body { ... }
......
<style type="text/css"> @import url(main.css); @import url(sub.css); </style>
@charset "Shift_JIS";
スタイルシートのファイルが記述されている文字コードを指定します。@charset に続いて、「"文字コード"」のように文字コードをダブルクォーテーション（"）で括ります。日本語の文字コードには、"SHIFT_JIS, EUC-JP, ISO-2022-JP, UTF-8" などがあります。大文字・小文字の区別は区別されません。
CSS では、コメントを入れる場合やフォント名、生成内容などで半角英数字以外の漢字や平仮名などの日本語の文字列を扱うことがあるため、スタイルシートを参照する文書が記述されている文字コードとスタイルシートファイル自体の文字コードが異なると、文字化けを起こし、User-Agent（ユーザーエージェント）は、日本語部分の内容を正しく解釈することができません。文字コードが異なる場合は、@charsetルールで、スタイルシートファイルの文字コードを指定することで、User-Agent（ユーザーエージェント）が正しく解釈するための情報となります。スタイルシートのファイルの中でのみ記述することができます。注意点として、@charsetルールは、スタイルシートファイルの中で一番最初に記述する必要があります。コメントや @importルールを先行させることも許されません。
@media screen,handheld,tv {
......
}
@media print {
......
}
@mediaルールは、特定のメディア（環境）に対してのみスタイルを適用できるように振り分けることができます。指定方法は、@media に続いて、メディアの種類を指定し、中括弧（{ }）で囲んで中には、指定のメディアにのみ適用する専用のスタイルシートを記述します。複数のメディアを指定する場合は、メディアの種類をカンマ（,）で区切って列記します。CSS2.1 で定義されているメディアの種類には、次の 10種類があります。
HTML では、link要素と style要素に指定できる media属性と同じですが、media属性には、点字プリンタを出力対象とする "embossed" はありません。@mediaルールを使うことで、視覚環境用のスタイルと印刷用のスタイルなどを振り分けることができます。 また、@mediaルールは、Mac版Internet Explorer 5 が対応していないことから、Mac版Internet Explorer 5 における CSS のバグを回避するテクニックとしても使われています。
@page {
......
}
コンピュータの画面は、文書の矩形（四角形の）領域を切り取って表示し、スクロール機構によって連続的にアクセス可能な連続メディアです。一方、ページメディアは、改ページによってアクセスされます。ページメディアとは、embossed（点字プリンタ）, print（プリンタ）, projection（プロジェクタ）を指します。handheld（携帯機器） と tv（テレビベースのウェブブラウザ）は、ページメディアと連続メディアの両方の特性を持つとされます。ページメディアは、矩形（四角形の）領域のページボックスを生成して、文書をフォーマット化し、ページボックスを実際の紙や OHPシートに変換して出力します。
そこで、@pageルールは、ページメディアが印刷等でページとしてリソースを表示する際の見た目を規定します。規定できるのはページのサイズ、向き、余白（マージン）、トンボの形等です。@pageルールには、sizeプロパティ, marksプロパティ, pageプロパティと云った専用のプロパティが用意されています。@page に続いて、中括弧（{ }）で囲んで中にスタイルシートを記述します。 現在、@pageルールに対応している視覚ブラウザはありません。