CSS選擇器用于指定樣式應用到哪些DOM元素上。父級選擇器可以幫助我們根據元素在DOM樹中的位置選擇特定的元素。
/* 父元素為 div 的 p 元素*/ div >p { color: red; }
在上面的例子中,我們使用了直接子選擇器(>)來選擇所有父元素為 div 的p元素,并將它們的顏色設置為紅色。
除了直接子選擇器,我們還可以使用空格來選擇后代元素。例如:
/* .wrapper 元素內的所有 p 元素 */ .wrapper p { font-size: 16px; }
在這個例子中,我們選擇了所有在類名為 .wrapper 的元素內的 p 元素,并把它們的字體大小設置為16px。
還有一種選擇器是相鄰兄弟選擇器(+),可以選擇與指定元素在同一層級中的下一個兄弟元素。以下是一個例子:
/* 選擇緊接著元素后的
元素 */ h2 + p { color: blue; }
在這個例子中,我們選擇了緊接著 h2 元素后面的 p 元素,并把它們的字體顏色設置為藍色。
這些父級選擇器的應用可以使我們更方便地選擇特定的DOM元素,并根據我們的需求來定制樣式。
上一篇css選擇器 標簽
下一篇css選擇器li a