外部樣式表是CSS的一種常見應(yīng)用方式，它使得我們可以將CSS樣式代碼單獨(dú)存放到一個(gè)CSS文件中，然后在網(wǎng)頁中引用這個(gè)CSS文件，從而實(shí)現(xiàn)網(wǎng)頁樣式和結(jié)構(gòu)的分離。下面來看一個(gè)CSS外部樣式表的例子。
/* 定義一個(gè)外部style.css樣式表 */
.header {
background-color: #333;
color: #fff;
padding: 15px;
}
#content {
width: 800px;
margin: 0 auto;
}
.footer {
background-color: #333;
color: #fff;
padding: 15px;
}上面的代碼定義了三個(gè)樣式規(guī)則，分別用于網(wǎng)頁的頭部、內(nèi)容區(qū)域和底部，具體的樣式屬性可以根據(jù)需求自行修改。
接下來，在HTML網(wǎng)頁中引用這個(gè)外部樣式表：
My Website My Website
Welcome to my website!
在HTML文件的head標(biāo)簽中，我們使用link標(biāo)簽將style.css樣式表文件鏈接到HTML文件中。接著，在HTML文件的主體部分，我們可以直接引用樣式表中定義的類和id選擇器來設(shè)置樣式。
這樣，我們就實(shí)現(xiàn)了CSS樣式代碼和HTML結(jié)構(gòu)代碼的分離，有利于代碼的維護(hù)和管理。