How to select the last few elements with css selector

WBOY
Release: 2021-12-14 15:23:06
Original
7530 people have browsed it

In CSS, you can use the ":nth-last-child()" selector to select the last few elements. This selector starts counting from the last child element of the parent element to match the parent element. Child element, the syntax is "parent element: nth-last-child (reciprocal value of child element) {css style code;}".

How to select the last few elements with css selector

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

How to select the last few elements in css selector

In css, you want to use the selector to select the last few elements , you can use the :nth-last-child(n) selector.

:nth-last-child(n) The selector matches every element that is the Nth child of its element, regardless of the element's type, counting from the last child.

n can be a number, a keyword, or a formula.

The example is as follows:

<html>
<head>
<meta charset="utf-8"> 
<title>123</title> 
<style> 
p:nth-last-child(2)
{
background:#ff0000;
}
</style>
</head>
<body>
<p>The first paragraph.</p>
<p>The second paragraph.</p>
<p>The third paragraph.</p>
<p>The fourth paragraph.</p>
<p>选择p元素中的倒数第二个元素,改变其背景颜色。</p>
</body>
</html>
Copy after login

Output result:

How to select the last few elements with css selector

##(Learning video sharing:

css video tutorial

The above is the detailed content of How to select the last few elements with css selector. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
css
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template