CSS是網頁設計中很重要的一個元素，它可以控制網站的外觀和排版。然而，當一個HTML元素被多個CSS規(guī)則定義時，可能會出現優(yōu)先級的問題。這篇文章將會介紹CSS優(yōu)先級的關系。

CSS優(yōu)先級是用來確定哪個CSS規(guī)則將會被應用于HTML元素的。在CSS中，優(yōu)先級是從高到低排列的，高級別的規(guī)則會覆蓋低級別的規(guī)則。

CSS優(yōu)先級關系基于以下規(guī)則：

1. 同級別的CSS樣式，后面的規(guī)則會覆蓋前面的規(guī)則
2. ID選擇器比屬性選擇器優(yōu)先級更高
3. 內聯樣式（style屬性）優(yōu)先級最高

第一個規(guī)則的例子:

p {
color: red;
}
p {
color: blue;
}

在這個例子中，p元素的文本顏色將會是藍色，因為后面的規(guī)則會覆蓋前面的規(guī)則。

第二個規(guī)則的例子:

#main {
background: black;
}
body p {
background: white;
}

在這個例子中，ID選擇器#main的背景色是黑色，而普通段落元素的背景色是白色。

第三個規(guī)則的例子:

p {
color: green;
}
<p style="color: red">This text is red</p>

在這個例子中，內聯樣式的顏色是紅色，它將會覆蓋普通p元素的綠色文本顏色。

總的來說，CSS優(yōu)先級關系可以幫助開發(fā)者更好地掌握樣式被應用的順序，并決定哪個樣式會對網頁產生最終影響。