At-rules分装不同的CSS规则，应用在特定场合。

Importing

import@规则引用另外的样式。例如，如果你想添加另外样式到现在的样式，可以这样：

@importurl(addonstyles.css);

这很像使用link元素连接CSS到HTML，本质上说有一个内容样式像下面：

styletype="text/css"media="all"@importurl(monkey.css);/style

这是为了照顾老版本浏览器，比如Netscape4不支持@规则所以不能链接样式表，已经构建好标签的HTML页面会失去样式表提供的功能。

Mediatypes

media@规则应用内容使用特定媒体，比如打印，例如：

@mediaprint{

body{

font-size:

font-family:timesnewroman,times,

}

#navigation{

display:

}

}

媒体形式：

all，所有媒体。

aural，言语合成器。

handheld，移动设备

print，打印

projection，投影

screen，电脑屏幕

你还可以使用braille,embossed,tty或者tv。

注意：说了这么多，IE只支持all,screen和print。

Charachtersets字符设定

charset@规则简单设定外部样式里的编码。它出现在样式的最上面例如@charset"ISO-8859-1";

Fontfaces字体外观

font-face@规则用来详细描述字体，可以在CSS里嵌入外部字体。

它需要font-family描述符引用字体，它的值可以是字体的名称或是新命名一个。嵌入一个字体，使用src描述符。其他添加到font-face@规则里的描述符将影响正在使用的内含字体，例如如果你添加font-weight:bold粗体到@规则，font-family的src只能运用到带有font-family属性的选择器里，而且选择器里font-weight属性同样设置成bold。

看下面例子：

@font-face{

font-family:somerandomfontname;

src:url(somefont.eot);

font-weight:

}

p{

font-family:somerandomfontname;

font-weight:

}

如上面的例子，段落里的字体将是somefont的字体（如果p选择器没有font-weight:bold，那字体就不是somefont）

嵌入字体还凑合着用，因为Mozilla浏览器不支持也没有计划添加这个功能。只有IE有分寸的支持，但这也不是说可以直接使用，IE浏览器嵌入字体，你还需要微软WEFT软件，它提供Truetype字体转换成压缩的OpenType字体（只有这个你才能使用URI指定）。由于这个限制（显得非常复杂）兼容性，最好不要使用系统没有的字体。

Pages

page@规则服务页面媒体，是个高级方式应用于打印媒体样式。它定义了页面块，在盒模型上扩展，所以你可以定义单一页面的大小和表现。

应用page@规则有许多规定，比如没有padding和border，而且也不上我们说的电脑屏幕，所以pixels和ems单位不被允许使用。

有许多特定属性可以使用，比如size，可以设定portrait纵向,landscape横向,auto自动或长度。marks属性可以用来定义裁剪标志

@page{

size:15cm

margin:

marks:

}

页面媒体里的伪标签

有三种伪标签用来链接特定page@规则，如下形式：@page:pseudo-class{stuff}。

:first应用到页面媒体里的第一页

:left和:right应用到左边和左边页面。这可能用在指定有非常大margin的左边页面和有非常大margin的右边页面。

还有一些页面@规则，比如page-breaks页面中断和namedpages页面命名，但这些@规则在浏览器里很难工作，你也许浪费了许多时间阅读这篇文章，不过这些都是不错的想法。