Overview of new selectors in CSS3

selector :first-child This is the descendant selector. Weird, please avoid rather than understand.

selector:first-child

 当前 selector 选中的元素集合中的第一个元素

selector:last-child

当前 selector 选中的元素集合中的最后一个元素.

But there is a problem, :last-child does not take effect.

should be:
1 The parent element parent of the current selector
2 All child elements of parent, [a,b,c]
3 The first element of the collection of child elements, if it is a selector
4 sets the style, it will take effect.

  **if(selecor.parent.childElementList.firstElement === selector){
     生效
  }**

So use these two pseudo-classes and add a parent element to it. It can be considered It is the first implementation.

nth-child() also applies to the above rules.
Note that n here has a lot of room for development. Odd/even can be implemented. Which ones to choose? From Which ones should be selected first.

nth-last-child() Select backwards
:first-of-type
:last-of-type
:nth-of-type
:nth-last-of-type
:root
Select the root element of the document. It is html
:empty
Select the element that does not even have a space in the element
:not
Negative selector

:only-child
It will only take effect when the collection has only one element.

::selection
Only two attributes can be set: background, color .

selector :first-child This is the descendant selector. Weird, pay attention to avoid rather than understand.

selector:first-child

 当前 selector 选中的元素集合中的第一个元素

selector:last-child

当前 selector 选中的元素集合中的最后一个元素.

But there is a problem, :last-child does not take effect.

should be:
1 The parent element of the current selector parent
2 parent All child elements, [a,b,c]
3 is the first element of the collection of child elements. If it is selector
4 to set the style, it will take effect.

  **if(selecor.parent.childElementList.firstElement === selector){
     生效
  }**

So use these two pseudo Class, add a parent element to it. It can be considered as the first implementation.

nth-child() also applies to the above rules.
Note that n here has a lot of room for development. , can realize odd/even, which ones to choose, and which ones to start from.

nth-last-child() Select backwards
:first-of-type
:last- of-type
:nth-of-type
:nth-last-of-type
:root
Select the root element of the document. That is html
:empty
Select the middle element Elements with no spaces
:not
Negative selector

:only-child
will only take effect when the collection has only one element.

::selection
Only two attributes can be set: background, color.

For more CSS3 new selector overview, please pay attention to the PHP Chinese website for related articles!