CSS選擇器就近原則是指在特定的HTML標簽中使用不同的CSS選擇器時,選擇器會優先匹配離目標元素最近的選擇器,忽略其他選擇器的同名樣式。
/* html */ <div class="box"> <p>Hello World!</p> <div class="inner"> <p>Goodbye World!</p> </div> </div> /* css */ .box p { color: red; } .inner p { color: blue; }
在以上代碼中,有一個class為box的div里面嵌套了兩個p標簽。其中,p標簽"Hello World!"被.box p選擇器樣式匹配(顯示紅色),而p標簽“Goodbye World!”被.inner p選擇器樣式匹配(顯示藍色)。
選擇器就近原則對于CSS樣式的優化是非常重要的。如果在多個選擇器中存在同名樣式,而程序卻沒有應用正確的規則,就會導致樣式混亂,影響用戶體驗。
上一篇mysql 菜單查詢
下一篇css選擇器多個屬性