css3結構性偽類選擇器 last child

2021-09-08 11:34:43 字數 544 閱讀 6591

「:last-child」選擇器與「:first-child」選擇器作用類似,

不同的是「:last-child」選擇器選擇的是元素的最後乙個子元素。

例如,需要改變的是列表中的最後乙個「li」的背景色,就可以使用這個選擇器,

ul>li:last-child

示例演示

在部落格的排版中,每個段落都有15px的margin-bottom,假設不想讓部落格「post」中最後乙個段落不需要底部的margin值,可以使用「:last-child」選擇器。

html**:

第一段落

第二段落

第三段落

第四段落

第五段落

.post
.post p
.post p:last-child
演示結果:

CSS3選擇器 結構性偽類選擇器

在學習結構性偽類選擇器之前,先了解2個概念 css中的偽類選擇器和偽元素 1 偽類選擇器 css中已經定義好的選擇器,不能隨便取名 常用的偽類選擇器是使用在a元素上的幾種,如a link a visited a hover a active 2 偽元素選擇器 並不是針對真正的元素使用的選擇器,而是針...

css3結構性偽類選擇器 target

target選擇器稱為目標選擇器,用來匹配文件 頁面 的url的某個標誌符的目標元素。我們先來上個例子,然後再做分析。html content for brand css menusection target 演示結果 分析 1 具體來說,觸發元素的url中的標誌符通常會包含乙個 號,後面帶有乙個標...

CSS3 結構性偽類選擇器 target

target選擇器稱為目標選擇器,用來匹配文件 頁面 的url的某個標誌符的目標元素。我們先來上個例子,然後再做分析。示例展示 點選鏈結顯示隱藏的段落。html id brand content for brand css menusection target 演示結果 分析 1 具體來說,觸發元素...