CSS中at(@)指示符用法詳解
這里和大家分享一下CSS中使用at(@)指示符的用法，比如說導入import ，使用at規則將吞入另外的樣式表。如果你需要把另外的樣式表的樣式添加到現有的，這經常用來取代連接CSS到HTML中的<link>標簽，本質上就是一個內部樣式表的形式。
CSS中使用at(@)指示符
導入
導入import at規則將吞入另外的樣式表。比如，如果你需要把另外的樣式表的樣式添加到現有的，你可以這樣做：
示例代碼
- @importurl(addonstyles.css);
這經常用來取代連接CSS到HTML中的<link>標簽，本質上就是一個內部樣式表的形式，看起來像這樣：
示例代碼
- <styletypestyletype="text/css"media="all">
- @importurl(monkey.css);</style>
這樣做的好處是，一些老瀏覽器如Netscape4.x不接受at規則，進而不連接樣式表，從而，如果你有良好結構的標記，只剩下樸素功能的HTML（盡管沒有樣式）。
媒體類型
媒體mediaat規則將把內容應用到指定的媒體，比如打印。比如
示例代碼
- @mediaprint{
- body{font-size:10pt;
- font-family:timesnewroman,times,serif;}
- #navigation{display:none;}
- }
媒體類型可以是：
all──每一個太陽下、上、周圍、里面的所有媒體類型。
aural──語音合成器。
handheld──手持設備。
print──打印機。
projection──投影儀。
screen──電腦屏幕。
還可以使用braille（布萊葉點字）、embossed（壓印）、tty（終端）和tv（電視）。#p#
字符集
字符集charset at規則設置一個外部樣式的字符編碼，它應該出現在樣式的頂端，大致如此：@charset"ISO-8859-1";
字體外觀
字體外觀font-face at規則用來詳細描述一個能嵌入CSS的外部字體。
它必須一個font-family的字體可以參考的描述符，值可以是系統已經存在的字體名稱（這種情況發生時會覆蓋掉該字體），也可以是全新的名字。為了嵌入一個字體，需用使用src描述符。字體外觀at規則的其他描述符是使用該字體的一些條件，比如，在at規則里面增加一條font-weight:bold樣式，如果font-weight屬性也設置了bold，font-family的src將應用該規則到帶有font-family屬性的選擇符。
使用字體外形
at規則看起來像這樣：
示例代碼
- @font-face{font-family:somerandomfontname;
- src:url(somefont.eot);
- font-weight:bold;}
- p{font-family:somerandomfontname;
- font-weight:bold;}
這將使somefont.eot這個字體應用到段落里（如果p選擇符沒有設置成font-weight:bold的話就不會）。
注意：
現在內嵌字體的支持度還算湊合。基于Mozilla的瀏覽器不支持，并且也沒有最近的計劃顯示它會支持。僅InternetExplorer似有一定程度上的支持，但也沒有直接得方法。為了在IE中嵌入字體，你需要使用微軟的WEFT軟件，它會把一個TrueType字體轉換成一個壓縮的OpenType字體（這也值嗯嗯在指定的URI上使用）。因為有限的（也相當復雜）的兼容性，最好不要使用沒有適合的可替換系統字體的內嵌字體。
頁面
頁面pageat規則用于頁式（分頁）媒體，是一個把樣式應用到打印媒體的先進方法。它定義頁面塊的盒狀模型（見邊界和補白）擴展因此你可以定義一個獨立頁面的尺寸和表現。
應用pageat規則有許多約定，比如沒有補白和邊界，我們也沒有談論電腦屏幕──點（pixel）和em作為單位是不可以的。
可以使用很多指定屬性，比如尺寸size，可以設置為portrait（豎排格式）、landscape（橫排格式）、auto（自動）或者一個高度。marks屬性也可以用來定義裁剪標志。
示例代碼
- @page{size:15cm20cm;margin:3cm;marks:cross;}
頁式媒體的偽類
有三個偽類被用來指定與pageat規則相結合，用如此形式：@page:pseudo-class{stuff}。
:first應用到頁式媒體的第一頁。
:left和:right分別用于左邊和右邊的頁面。這可以用來指定左邊或者右邊頁面一個更大的邊界。
還有其他更多的小方面指定頁面at規則，比如頁面分隔符和命名頁面，但鑒于這個at規則很難在任何瀏覽器上工作，你可能在浪費時間在閱讀這些東西上面。
本文來自CSS在線：http://www.csscss.org/cssarticle/2009531124.shtml
【編輯推薦】
