如何高亮第一段
在本指南中,您可以瞭解如何在容器內高亮第一段。
樣式化第一段
您希望將第一段的字型變大並加粗。您可以為第一段新增一個類,然後透過該類來選擇它,但使用偽類選擇器更靈活——它意味著您可以根據段落的文件位置來定位它,並且如果源順序發生更改,您無需手動移動類。
使用偽類
一個 偽類 的作用就像您應用了一個類一樣;然而,CSS 不是使用類選擇器,而是根據文件結構進行選擇。有許多不同的偽類可以選擇不同的內容。在我們的例子中,我們將使用 :first-child。這將選擇父元素的第一個子元素。
html
<div class="wrapper">
<p>
Veggies es bonus vobis, proinde vos postulo essum magis kohlrabi welsh onion
daikon amaranth tatsoi tomatillo melon azuki bean garlic.
</p>
<p>
Gumbo beet greens corn soko endive gumbo gourd. Parsley shallot courgette
tatsoi pea sprouts fava bean collard greens dandelion okra wakame tomato.
Dandelion cucumber earthnut pea peanut soko zucchini.
</p>
</div>
css
.wrapper p:first-child {
font-weight: bold;
font-size: 130%;
}
您可以嘗試在上面的即時示例中將 :first-child 更改為 :last-child,您將選中最後一個段落。
每當您需要定位文件中的某個內容時,您可以檢視是否有可用的 偽類 可以幫您完成。
另見
偽類參考頁面。- 學習 CSS:偽類和偽元素。