在開發網站時，我們經常需要使用CSS來改變網頁的外觀和布局。然而，當我們使用多個CSS樣式時，不同的樣式可能會產生沖突，導致最后的效果與我們期望的不同。這時候，我們需要了解CSS樣式的覆蓋規律，以正確地控制網頁的樣式。

首先，當多個樣式作用于同一個元素時，CSS會根據權重來確定哪個樣式應該被應用。權重的計算規則如下：

選擇器中包含的ID屬性值數量 * 100
選擇器中包含的class屬性值、屬性選擇器或偽類數量 * 10
選擇器中包含的元素標簽或偽元素數量 * 1

例如，對于以下兩個樣式：

#header {
color: red;
}
body #header {
color: blue;
}

因為第二個樣式的選擇器中包含了一個ID屬性值和一個元素標簽，而第一個樣式的選擇器只包含了一個ID屬性值，所以第二個樣式的權重更高，最終應用的顏色是藍色。

其次，如果兩個樣式的權重相同，CSS會根據順序來決定哪個樣式應該被應用。后定義的樣式會覆蓋之前定義的樣式。

舉個例子：

h1 {
font-size: 20px;
}
h1 {
font-size: 30px;
}

其中，第二個樣式會覆蓋第一個樣式，因此h1元素的字體大小是30px。

最后，還有一些特殊的樣式表，如瀏覽器自帶的樣式表。這些樣式表也會影響網頁的樣式，但是它們的權重很高，比我們自己編寫的樣式表的權重還要高。因此，我們需要在編寫樣式時考慮到這一點。

總之，掌握CSS樣式的覆蓋規律，可以幫助我們更好地控制網頁的外觀和布局，讓我們的網頁更加美觀、易讀和易用。