How to use nth-of-type pesudo class in CSS

:nth-of-type

This is a pseudo-class.
This allows you to select one or more elements based on their source order, according to a formula.
This is similar as nth-child.

Standard Formula

:nth-of-type(an+b){
	:declarations
}

the syntax ‘an+b’ is here by expressed:

‘a’ is an integer value.
‘n’ is the literal letter ‘n’.
‘+’ is an operator and may be either ‘+’ or ‘-‘.
‘b’ is an integer and is required if an operator is included in the formula.

Suppose we are building a CSS listing, and we want to change background color of each second column:

Rather than adding a class on last item , we can use ::nth-of-type

Here you can see example

here are some of more examples

1 :first-of-type

:first-of-type{
	:declarations
}

2 :last-of-type

:last-of-type(an+b){
	:declarations
}

3 :nth-last-of-type

:nth-last-of-type(an+b){
	:declarations
}