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