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

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

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

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

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

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

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