在HTML文檔中應用css樣式大致有三種方法：1.link標簽鏈接外部樣式表；2.使用style元素包含樣式表；3.使用style屬性，即內聯樣式
一.link標簽鏈接外部樣式表
先看一條較為標准的link標記語句：
<link rel="stylesheet" type="text/css" href="main.css" media="all" />
link標記必須放在head元素中，且不能放在其他元素（如title）內部。至於其屬性，rel 代表“關系“（relation），在這里，關系為stylesheet，即文檔的外部樣式表，至於其他值以及含義詳情見 http://www.w3school.com.cn/tags/att_link_rel.asp 。type總是設置為text/css，描述了使用link標記加載的數據的類型。href那么簡單的就不多說了。media 屬性規定被鏈接文檔將顯示在什么設備上。當然，link標記還有其他的一些屬性，比如title（除了說的這五個，其他的屬性貌似都沒啥作用了），接下來就說聊到這個title屬性的作用。
外部樣式表之候選樣式表：將rel屬性設置為alternate stylesheet 時，就可以定義候選樣式表，只有在用戶選擇這個樣式表時才會用於文檔表現。例如：
1 <link rel="stylesheet" type="text/css" href="sheet1.css" title="Default" /> 2 <link rel="alternate stylesheet" type="text/css" href="bigtext.css" tile="BigText"/> 3 <link rel="alternate stylesheet" type="text/css" href="crazy.css" tile="CrazyText"/>
貌似目前Chrome還不支持這種候選樣式表，我也沒有找到Chrome的菜單欄，不過IE、FF均支持此功能（切換樣式表的方法：按下Alt鍵打開菜單欄->查看->樣式->選擇樣式表）。注意：①這些樣式表只有一個會用於文檔顯示，不會發生重疊；②並且每個樣式表都得有title屬性，不然菜單欄里面沒有顯示；③默認樣式表（也叫首選樣式表）是rel為stylesheet的樣式表，與title屬性的值沒有關系。
還可以為候選樣式表指定同樣的title，把它們分組在一起。例如：
1 <link rel="stylesheet" type="text/css" href="sheet1.css" title="Default" media="screen" /> 2 <link rel="stylesheet" type="text/css" href="print-sheet1.css" title="Default" media="print" /> 3 <link rel="alternate stylesheet" type="text/css" href="bigtext.css" title="BigText" media="screen" /> 4 <link rel="alternate stylesheet" type="text/css" href="print-bigtext.css" title="BigText" media="print" />
這樣以來用戶就可以在屏幕和打印媒體中為網站選擇不同的樣式表。
二.使用style元素包含樣式表
style標記之間的樣式稱為文檔樣式表，或嵌套樣式表。注意：①一定要使用type屬性，其值為"text/css"，也可以指定media屬性；
在這里介紹一個@import指令，它用於指示Web瀏覽器加載一個外部樣式表，不過這條指令要放在其他css規則之前，否則不起作用。例如：
1 <style type="text/css"> 2 @import url(main.css); 3 @import url(sheet1.css) all; 4 @import url(print.css) print; 5 h1{color:blue;} 6 </style>
@import指令的一個顯著作用就是：如果有一個外部樣式表，它需要使用其他外部樣式表中的樣式時就可以在開頭使用這條指令導入其他樣式表。
三.內聯樣式
除了在body外部出現的標記，style屬性可以與任何其他HTML標記關聯來設置其內聯樣式。注意：①不能在style屬性中使用@import指令。