在網頁開發中,常常會使用CSS來控制網頁的樣式與布局,但是如果直接將CSS樣式寫在HTML標簽中,會導致代碼冗長且難以維護。因此,我們可以將CSS放在一個外部文件中,然后通過引入該文件來設置HTML標簽的樣式。
<link rel="stylesheet" type="text/css" href="style.css">
在上述代碼中,我們使用的是link標簽,其中rel屬性表示關聯的文檔類型,type屬性表示關聯的文件類型,href屬性表示關聯的文檔地址(即CSS文件的路徑)。
在CSS文件中,我們可以設置全局樣式、單個標簽的樣式、類樣式和ID樣式等。其中,全局樣式會影響到整個文檔中的全部標簽,類樣式針對某些標簽進行樣式設置,而ID樣式則只作用于某個特定的標簽。
body { background-color: #f2f2f2; } p { font-size: 16px; color: #333; } .title { font-size: 24px; font-weight: bold; } #main { width: 80%; margin: 0 auto; }
在上述CSS代碼中,我們設置了一個全局樣式(body),針對p標簽進行樣式設置,同時還定義了一個類樣式(.title)和一個ID樣式(#main)。
使用CSS文件外部引入的句式不僅使代碼更加簡潔、易于維護,同時也使得樣式與布局相互分離,進而使得頁面開發更加規范化、標準化。