CSS中的層級關(guān)系可以幫助我們在樣式中實(shí)現(xiàn)更精確的目標(biāo)。下面是一些示例，展示如何使用層級關(guān)系實(shí)現(xiàn)各種效果。

首先，可以使用父元素的類或ID對子元素應(yīng)用樣式，如下所示：

.parent-class .child-element {
/* 樣式 */
}
#parent-id .child-element {
/* 樣式 */
}

這將會應(yīng)用于擁有指定父元素類或ID的子元素。這對于僅限于某些上下文元素的樣式非常有用。

其次，可以使用子選擇器對指定元素的子元素應(yīng)用樣式：

.parent-element >.child-element {
/* 樣式 */
}

這將會應(yīng)用于指定元素的直接子元素。這對于在只應(yīng)用于特定子元素的情況下避免選擇祖先元素非常有用。

還可以使用兄弟選擇器來選擇同級的元素，如下所示：

.element1 + .element2 {
/* 樣式 */
}
.element1 ~ .element3 {
/* 樣式 */
}

第一個示例將應(yīng)用于元素1之后的第一個元素2，而第二個示例將應(yīng)用于元素1之后的所有元素3。

最后，可以使用通用選擇器（*）來選擇所有元素，并將層疊樣式應(yīng)用于每個元素：

* {
/* 樣式 */
}

這將會影響頁面上的每個元素，并非常有用，以快速設(shè)置基本樣式、重置瀏覽器默認(rèn)樣式或應(yīng)用一般的全局樣式。