HTML僅能呈現一些訊息，表現能力非常有限，需要結合CSS一起使用，以使頁面更加精美。在一個網頁中，所有的樣式程式碼均可移出HTML文檔，然後移入一個獨立的樣式表。
CSS 樣式既可以作為單獨的文件（.css類型的文件）引入到HTML 文件中，也可以直接寫在HTML 文件中，大致分為以下四種方法：
1.內嵌樣式表
嵌入式：將CSS樣式集中寫在網頁的<head></head>標籤對的<style></style>標籤對中；
在HTML的<head>標籤中的<style>標籤中加入css樣式，使用內嵌樣式表定義的CSS 樣式只能在目前網頁內使用。
<!DOCTYPEhtml><html><head><title>內嵌樣式</title><style>body{background-color:linen;}h1{color:maroon;margin-left:40px;}</style>< /head><body><h1>樣式</h1></body></html>因為內嵌樣式表需要將CSS 樣式定義在HTML 文檔的內部，所以會導致文檔的體積變大，而且當有其它文檔也需要使用內嵌樣式表中同樣的樣式時，無法引入到其他文檔，必須在其它文件中重新定義，會導致程式碼冗餘，不利於後期維護。
2. 內聯樣式
行內式：也稱為內聯式，在標記的style屬性中設定CSS樣式。這種方式並沒有反映出CSS的優勢；
內嵌樣式就是將樣式資訊直接定義在HTML 標籤的style 屬性中，由於內嵌樣式定義在標籤內部，所以它只對所在的標籤有效。
<!DOCTYPEhtml><html><head><title>內聯式</title></head><body><h1style=color:maroon;margin-left:40px>內聯式</h1></body ></html>內聯樣式雖然可以很方便的為HTML標籤賦予CSS樣式，但它的缺點也非常明顯，不建議過度使用。
（1）定義內聯樣式需要在每個HTML 標籤中定義style 屬性，很不方便；
（2）在內嵌樣式中使用雙引號或單引號時要特別小心，因為HTML 標籤的屬性通常都會使用雙引號來包裹屬性的值，例如<input type=text>；
（3）在內聯樣式中定義的樣式不能再其它任何地方重複使用；
（4）內聯樣式在後期維護時很不方便，因為一個網站通常有很多頁面組成，當修改頁面樣式時需要對頁面逐個修改；
（5）新增過多的內聯樣式會導致HTML 文件的體積增加。
3. 外部樣式表
連結式：跟第4個的導入式都稱外部式或外聯式，使用link引用外部CSS檔；
外部樣式表是最常見也是最推薦的引用CSS 的方式，您只需要將CSS 樣式定義在一個.css 格式的檔案中，然後使用HTML 的<link>標籤將這個.css 格式的樣式檔案套用到HTML文檔中。
<!DOCTYPEhtml><html><head><title></title><linkrel=stylesheethref=./style.css></head><body><h1>外部樣式表</h1></body>< /html>
因為CSS 樣式定義在單獨的.css 格式的檔案中，所以可以在多個頁面之間引用，若要修改網頁的樣式，只需要修改這個CSS 樣式檔即可，很方便。
4.匯入樣式表
導入式：使用@import引用外部CSS檔；
您同樣可以使用@import來引用外部樣式表，這一點與使用<link>標籤比較相似。建立一個總的先style.css，將所有的樣式先匯入style.css。
HTML：
<!DOCTYPEhtml><html><head><title></title><linkrel=stylesheethref=style.css></head><body><h1>外部樣式表</h1></body></html >
style.css:
@import1.css;@import2.css;@import3.css;@import4.css;
1.css:(1到4的css相同，都是新增樣式)
.top1{list-style-type:none;margin:0;padding:0;}