子選擇器 相鄰兄弟選擇器

今天新學習的關於css的各種選擇器，其中子選擇器和相鄰兄弟選擇器比較重要，可以大大的減少文件中class特性的數量。下面用乙個簡單的例子介紹一下他們的用處。

事例中需要表達的樣式為： 第乙個段落無邊框也無背景色；

所有中的段落都有邊框；

最後3個段落背景色為灰色；

>相鄰兄弟選擇器

title

>

5<

style

type

="text/css"

>6p

7div>p

8p+p+p

9style

>

10head

>

1112

<

body

>

13<

p>paragraph one:not inside a div element.

p>

14<

div>

15<

p>paragraph one: inside a div element.

p>

16<

p>paragraph two: inside a div element.

p>

17<

p>paragraph three: inside a div element.

p>

18<

p>paragraph four: inside a div element.

p>

19<

p>paragraph five: inside a div element.

p>

20div

>

2122

body

>

23html

>

其中，div>p{}是子選擇器的用法，他的意思是選擇器將匹配任何作為元素的直接子元素，因為事例中第一條元素不需要有邊框和背景，我們只對元素中的元素加以控制。

兄弟選擇器和相鄰兄弟選擇器

1 兄弟選擇器 brother selector，bs bs是css3.0新增的乙個選擇器，語法格式 a b a b為html元素 標籤，表示a標籤匹配selector的a，b標籤匹配selector的b時，b標籤匹配樣式 hello word hello word hello word hello...

CSS後代選擇器,子選擇器和相鄰兄弟選擇器

平時在 練習中，經常用到後代選擇器，子選擇器也會用到，這裡做個總結 1，後代選擇器和子選擇器區別 寫法不一樣 後代選擇器的標識為 空格 如 ul li ul和li之間用空格隔開 子選擇器的標識為 如 ul li ul和li之間用 隔開 相鄰兄弟選擇器的標識為 如 h1 p h1和p之間用 隔開 功能...

相鄰兄弟選擇器

相鄰兄弟選擇器 adjacent sibling selector 可選擇緊接在另一元素後的元素，且二者有相同父元素。相鄰兄弟選擇器使用了加號 即相鄰兄弟結合符 adjacent sibling combinator 注釋 與子結合符一樣，相鄰兄弟結合符旁邊可以有空白符。請看下面這個文件樹片段 cs...