CSS作為網頁設計的重要組成部分，常常會遇到樣式覆蓋的問題。下面我們就來分析一下，CSS樣式為什么會被覆蓋。

CSS樣式規則的優先級是根據“權重”（specificity）、“重要性”（importance）和“源代碼次序”（source order）來決定的。

首先是“權重”。CSS選擇器的權重是由選擇器的種類、id選擇器、類選擇器、屬性選擇器、偽類選擇器等決定的。其中，id選擇器的權重最高，類選擇器次之，屬性選擇器、偽類選擇器以及元素選擇器的權重最低。因此，當存在多個選擇器且有沖突時，權重越高的選擇器優先級越高。

/* 以下是權重依次遞增的幾種選擇器 */
#id { color: red; } /* 權值：0,0,1,0 */
.class { color: blue; } /* 權值：0,0,0,1 */
[type="text"] { color: green; } /* 權值：0,0,0,1 */
a:hover { color: yellow; } /* 權值：0,0,0,1 */

其次是“重要性”。在CSS樣式表中，可以用“!important”來聲明當前樣式的重要性。擁有“!important”聲明的樣式將覆蓋其他所有樣式。但是，過度使用“!important”會破壞CSS的繼承機制，導致不易維護的代碼。

.color-red { color: red !important; } /* 具有最高的優先級 */

最后是“源代碼次序”。因為瀏覽器解析樣式表是按照從上到下的順序，所以在樣式表中后面的樣式會覆蓋前面的樣式，即使前面的樣式權重更高。因此，前面的樣式可以通過“!important”來提高權重，以避免被后面的樣式覆蓋。

p { color: blue; }
p { color: red; } /* 后面的樣式將覆蓋前面的樣式 */

綜上所述，CSS樣式的覆蓋是由“權重”、“重要性”和“源代碼次序”三個因素共同影響的結果。我們需要根據具體情況，合理使用這些因素，以使樣式表呈現我們所期望的效果。