在學習 HTML 和 CSS 的過程中，我們可能會遇到多個樣式規(guī)則同時作用于一個元素的情況，這時候就需要了解優(yōu)先級的概念。優(yōu)先級指的是樣式規(guī)則的權重，決定了哪個規(guī)則會被瀏覽器選擇并應用到元素上。

優(yōu)先級的計算方式：
- 每個選擇器都有特定的權重值，權重值從高到低分別為：!important、內(nèi)聯(lián)樣式、ID、class、偽類、元素和通配符。
- 選擇器權重越高，其優(yōu)先級越高。
- 如果兩個樣式規(guī)則的權重相等，則后面的規(guī)則將覆蓋前面的規(guī)則。

下面通過幾個示例來說明優(yōu)先級的計算方法：

/* 元素選擇器 */
p {
color: red;
}
/* ID 選擇器 */
#para {
color: blue;
}
/* class 選擇器 */
.center {
color: green;
}
/* HTML 代碼 */
這是一個段落。
計算優(yōu)先級：
p 選擇器：元素權重為 1
#para 選擇器：ID 權重為 100，總權重為 100
.center 選擇器：class 權重為 10，總權重為 10
因此，#para 選擇器的樣式將被應用到該元素上，其顏色為 blue。

如果某個樣式規(guī)則使用了 !important 屬性，則說明該規(guī)則具有最高的優(yōu)先級，無論其他規(guī)則的權重如何，也無論該規(guī)則出現(xiàn)在哪個樣式表中，都將被瀏覽器應用到元素上。

/* class 選擇器 */
.center {
color: green !important;
}
/* HTML 代碼 */
這是一個段落。
無論其它規(guī)則的權重如何，該元素的顏色都會被設置為 green。

在編寫 CSS 樣式時，要注意控制優(yōu)先級，不要使用過多的 !important 屬性，以免破壞整個樣式層次結構，同時也方便管理和維護代碼。