CSS是网页设计中很重要的一个元素，它可以控制网站的外观和排版。然而，当一个HTML元素被多个CSS规则定义时，可能会出现优先级的问题。这篇文章将会介绍CSS优先级的关系。

CSS优先级是用来确定哪个CSS规则将会被应用于HTML元素的。在CSS中，优先级是从高到低排列的，高级别的规则会覆盖低级别的规则。

CSS优先级关系基于以下规则：

1. 同级别的CSS样式，后面的规则会覆盖前面的规则
2. ID选择器比属性选择器优先级更高
3. 内联样式（style属性）优先级最高

第一个规则的例子:

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

在这个例子中，p元素的文本颜色将会是蓝色，因为后面的规则会覆盖前面的规则。

第二个规则的例子:

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

在这个例子中，ID选择器#main的背景色是黑色，而普通段落元素的背景色是白色。

第三个规则的例子:

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

在这个例子中，内联样式的颜色是红色，它将会覆盖普通p元素的绿色文本颜色。

总的来说，CSS优先级关系可以帮助开发者更好地掌握样式被应用的顺序，并决定哪个样式会对网页产生最终影响。