使用外部CSS文件可以讓網(wǎng)站的樣式更加統(tǒng)一,方便維護(hù)。在HTML中,我們可以使用標(biāo)簽引用外部的CSS文件。下面是具體的步驟:
1. 在項(xiàng)目目錄中創(chuàng)建一個(gè)CSS文件,例如style.css。
2. 在HTML的標(biāo)簽中使用標(biāo)簽引用CSS文件,如下所示:來測(cè)試樣式是否生效,如下所示:
其中,rel屬性表示關(guān)系,type屬性表示文檔類型,href屬性表示CSS文件的路徑。 3. 在CSS文件中編寫樣式規(guī)則。例如,我們可以將標(biāo)題的顏色設(shè)為紅色,如下所示:<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
其中,h1表示標(biāo)題,color表示顏色,red表示紅色。將這段代碼保存到style.css文件中。 4. 在HTML中使用標(biāo)題標(biāo)簽h1 {
color: red;
}
來測(cè)試樣式是否生效,如下所示:<h1>Hello, world!</h1>
這時(shí)候我們打開瀏覽器,應(yīng)該可以看到標(biāo)題的顏色已經(jīng)變成了紅色。
使用外部CSS文件可以使我們的網(wǎng)站樣式更加規(guī)范化,管理起來也更加方便。在開發(fā)中,我們通常會(huì)將樣式規(guī)則分別寫到不同的CSS文件中,然后使用標(biāo)簽引用這些文件。這樣可以讓我們的樣式代碼更加清晰易懂,也方便后期維護(hù)和修改。
<h1>Hello, world!</h1>