在網頁設計中，HTML 用于定義網頁的結構，而 CSS 用于定義網頁的樣式，讓網頁更加美觀、易讀、易用。CSS 文件中包含了一系列的樣式規則，可以應用于 HTML 中的標簽、類、ID 等元素，從而使網頁的樣式統一、易于維護。

以下是一個簡單的例子，演示如何使用 CSS 文件中的樣式規則：

/* 在樣式文件中定義一個ID為 "example" 的樣式規則 */
#example {
color: red;
font-size: 24px;
}
/* 在 HTML 文件中應用該樣式規則 */
<div id="example">
這是一個示例文本。
</div>

在上述代碼中，樣式文件中定義了一個 ID 為 "example" 的樣式規則，其中指定了文本顏色為紅色、字號為 24 像素。而在 HTML 文件中，使用 div 標簽定義了一個 id 屬性為 "example" 的元素，并且該元素的樣式使用了樣式文件中定義的樣式規則。

使用 CSS 文件可以為網頁添加各種樣式效果，如背景色、邊框、圓角、陰影等。同時，樣式文件還可以通過類和標簽選擇器等方式來讓相同的樣式規則應用于多個元素，從而進一步減少代碼冗余，提高代碼效率。但是，過多的樣式規則和選擇器可能會降低網頁的性能，因此也需要注意樣式文件的優化和壓縮。