CSS級聯是一種描述樣式優先級的概念，指的是在一個網頁中同一元素被不同樣式定義時，瀏覽器如何根據優先級來展現該元素的樣式。
CSS級聯優先級順序如下：
行內樣式 >ID選擇器 >類選擇器、屬性選擇器、偽類選擇器 >標簽選擇器 >通配選擇器、繼承樣式
也就是說，具有行內樣式的元素優先級最高，其次是使用ID選擇器設置的樣式，然后是類選擇器、屬性選擇器、偽類選擇器設置的樣式，標簽選擇器的優先級排在其后。通配選擇器、繼承樣式的優先級最低。
下面我們來看幾個具體的例子：
例子1：
<!DOCTYPE html>
<html>
<head>
<title>CSS級聯優先級順序</title>
<style>
#title {
color: red;
}
.text {
color: blue;
}
</style>
</head>
<body>
<h1 id="title" class="text">Hello World!</h1>
</body>
</html>在上面的代碼中，我們同時使用了ID選擇器和類選擇器來定義h1元素的顏色。但是由于ID選擇器的優先級更高，所以最終標題的顏色將是紅色。
例子2：
<!DOCTYPE html>
<html>
<head>
<title>CSS級聯優先級順序</title>
<style>
.text {
color: blue;
}
p {
color: green;
}
</style>
</head>
<body>
<div class="text">
<p>This is a paragraph.</p>
</div>
</body>
</html>在上面的代碼中，我們將文本定義在一個名為"text"的div元素中，并且同時給p元素和類選擇器定義了顏色。由于p標簽選擇器的優先級更高，所以最終的段落顏色是綠色。
總而言之，了解CSS級聯的優先級順序可以幫助我們更好地掌握如何定義樣式，在多重樣式定義中明確樣式展現的優先級，避免出現樣式混亂的情況。
上一篇css紅色編碼對應rgb
下一篇css縱向下拉菜單效果