在網頁制作中,CSS外部樣式表的使用已經成為一種標準化的做法。通過CSS外部樣式表,我們可以將頁面的樣式與結構分離,讓頁面的結構更加清晰,樣式也更加靈活。
要使用CSS外部樣式表,我們需要創建一個CSS文件,然后在HTML文檔中使用link標簽將CSS文件與HTML文檔關聯起來。下面是一個簡單的使用示例:
<!DOCTYPE html> <html> <head> <title>我的網頁</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h1>歡迎來到我的網頁</h1> <p>這是一個段落,使用了CSS樣式。</p> </body> </html>
在上面的例子中,我們創建了一個名為style.css的CSS文件,并將其與HTML文檔關聯起來。CSS文件的內容如下:
body { background-color: #f2f2f2; font-size: 16px; } p { color: red; text-align: center; }
可以看到,CSS文件中包含了一些樣式規則。這些規則適用于HTML文檔中的所有元素。例如,我們使用了body選擇器來設置整個頁面的背景色和字體大小,使用了p選擇器來將段落的顏色設置為紅色,并居中顯示。
通過這種方式,我們可以輕松地管理整個網站的樣式,讓頁面看起來更加美觀和專業。同時,如果需要修改樣式,只需要修改CSS文件即可,無需逐個修改HTML文檔中的樣式。