## nth-child（n）、first-child、last-child用法

Note: E: nth-child (n ) to select parent element matches the n th element E ( is the n th element and the element E is to take effect ).
n may be a number, a keyword, or a formula.

nth-child (n) Usage:
. 1, Child-Nth (. 3)
indicating the selection list Tab 3, as follows:

Li: Child-Nth (. 3) {background: #fff}

2, Child-Nth (2N)
expressed selects even tag list, i.e., selects the second, fourth, sixth ...... tag, as follows:

Li: Child-Nth (2N) {background: #fff}

3, Child-Nth (2N-1)
represents an odd label selection list, i.e., selects the first, third, fifth, seventh ...... tag code as follows:

Li: Child-Nth (2N-. 1) {background: #fff}

. 4, Nth-Child (n-+. 3)
indicating the selection list of tags from the third to the last (positive selection), as follows:

Li: Nth-Child (n-3 +) {background: #fff}

. 5, Child-Nth (-n + 3)
represents the selection list tag from 0 to 3, i.e., less than 3, the label (adverse selection), as follows :

Li: Child-Nth (-n +. 3) {background: #fff}

. 6, Nth-Last-Child (. 3)
indicating the selection list in the penultimate three tabs, as follows:

Li: Nth-Last-Child (. 3) {background: #fff}

First-Child Usage:
. 1, First-Child
First Child-selection list represents the first label. code show as below:

Li: First-Child {background: #fff}

Last Child-Usage:
. 1, Last Child-
Last Child-selection list represents the last label, as follows:

li:last-child{background:#fff}

### Guess you like

Origin www.cnblogs.com/cui-ting/p/11422412.html
Recommended
Ranking
Daily