在網頁開發中，CSS文件和HTML代碼是必不可少的兩部分。CSS（Cascading Style Sheets）可以通過定義樣式規則來控制HTML中的元素。這些規則可以通過ID、類、標簽名稱等方式進行選擇。
假設我們有以下HTML代碼：
<!DOCTYPE html> <html> <head> <title>頁面標題</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>這是一個標題</h1> <p>這是一段文字。</p> <ul> <li>列表項1</li> <li>列表項2</li> <li>列表項3</li> </ul> </body> </html>
這里我們通過link標簽將CSS文件“style.css”引入到HTML頁面中。
下面是一個簡短的CSS文件的例子：
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
h1 {
color: blue;
text-align: center;
}
p {
color: green;
font-size: 16px;
}
li {
color: red;
}我們可以看到CSS中的規則與選擇器定義了各個HTML元素的樣式，例如在此例中，我們定義了整個文檔的背景色和字體、標題的顏色和居中、段落的顏色和字體大小、以及列表項的顏色。
當HTML頁面被瀏覽器渲染時，它將顯示定義在CSS文件中的樣式。這使得開發人員可以輕松地更改頁面的外觀，而無需重新編寫HTML代碼。使用CSS文件可以使HTML文檔更具可讀性、易于維護。