How css3 chooses the third li element

This article mainly explains "how css3 chooses the third li element". the explanation content in this article is simple and clear, easy to learn and understand. please follow the idea of Xiaobian and go deep into it slowly to study and learn "how css3 chooses the third li element" together!

In CSS, you can use the ":nth-child(n)" selector to select the third li element, which selects the nth child element under the parent element. When the number in the selector is 3, the third element will be selected. The syntax is "li:nth-child(3){CSS style code;}."

Operating environment of this tutorial: Windows 10 system, CSS3 && HTML5 version, Dell G3 computer.

CSS3 can choose the third element.

In CSS, to select the third li element, use the ":nth-child(n)" selector.

The:nth-child(n) selector matches the Nth child element belonging to its parent element, regardless of the element type.

n can be a number, keyword or formula.

Examples are as follows:

li:nth-child(3){background:#ff0000;} Sprite Cola Tea Coffee

Output:

Thank you for reading, the above is the content of "how to choose the third li element of css3". After studying this article, I believe everyone has a deeper understanding of how to choose the third li element of css3. The specific use situation still needs to be verified by practice. Here is, Xiaobian will push more articles related to knowledge points for everyone, welcome to pay attention!