最近我在做一個網頁，結果遇到了一個問題：CSS不能正常應用！

body {
background-color: #F5F5F5;
}
h1 {
font-size: 36px;
color: #333;
text-align: center;
}

按照正常的方式使用CSS，引入樣式表并寫好CSS代碼，但是網頁卻沒有按照我的想法展示。我檢查了代碼和引用的文件路徑，均沒有問題。

后來，我在瀏覽器的開發者工具中查看了元素的樣式。結果發現，我的CSS代碼被瀏覽器識別了，但是卻被其他的樣式覆蓋了。

經過查閱資料，我發現問題出在了層疊樣式表中。

/* 外部樣式表 */
h1 {
color: red;
}
/* 內部樣式表 */
h1 {
color: blue;
}
/* 行內樣式 */
這是一段文本

層疊樣式表（CSS）中如上代碼，h1元素綁定了三種不同的樣式途徑。這時，如果按照上面的順序排布，在一個h1標簽下，內部樣式表和行內樣式都會覆蓋外部樣式表。而在一般情況下，我們都會優先使用內部樣式表或行內樣式。所以最終，CSS的應用效果并不是我們想要的。

解決方法有兩種：

一是把相應的CSS代碼重寫，或者使用!important關鍵字來達到強制覆蓋的目的。

h1 {
color: blue !important;
}

二是設置樣式的優先級。CSS樣式的優先級是由選擇器的權重決定的。常用的選擇器有ID選擇器、類選擇器、標簽選擇器等。權重越高的選擇器所定義的樣式會優先被應用。比如說：

h1 {
color: red;
font-size: 32px;
}
/* ID選擇器比標簽選擇器優先級更高 */
#title {
color: blue;
font-size: 36px;
}
/* 類選擇器的優先級則在ID選擇器和標簽選擇器之間 */
.subtitle {
color: purple;
font-size: 28px;
}

本來應該是紅色字體，32px大小的h1標題，但在#title指定的樣式下，它擁有了更高的樣式權重，變成了藍色字體，36px大小的標題。如果我們同時使用ID選擇器和類選擇器，類選擇器也比標簽選擇器具有更高的權重。

總之，我們應該注意CSS代碼與元素的層級關系和樣式權重，加強對CSS選擇器的理解，才能更好地應用CSS樣式。