1. CSS选择器及其作用 CSS选择器是用于选择HTML元素并应用CSS样式的工具。它们帮助开发者精确地定位页面中的元素,以便为其添加样式或进行布局调整。 2. :nth-child()选择器的语法和基本用法 :nth-child() 是一个伪类选择器,用于选择属于其父元素的第N个子元素,不论这些子元素的类型是什么。其基本语法如下: css...
1. 类型 结构伪类选择器 -child 和 -of-type 分别有五个前缀,即 nth,nth-last,first,last,only(少用,不做示例) 1.1 -child类型: first-child, last-child, nth-child(n), nth-last-child(n). 示例:-child类型的选择器,首先选择的是位置,其次是在看元素, 例如.one p:nth-last-child(6) { font-...
1.:first-child: 伪类选择器,选取其父元素的第一个子元素的元素 2.:last-child:伪类选择器,选取其作为父元素的最后一个子元素 3.:nth-child(n):伪类选择器,选其作为父元素的第n个子元素的元素。 4.:::before:伪元素选择器,所有子元素的最前面添加一个伪元素。 5,::after:伪类选择器,所有子类的最后添...
1):first-child 可以选中第一个子元素 2):last-child 可以选中最后一个子元素 3):nth-child 可以选中任意一个子元素 该选择器可以指定一个参数,指定要选中第几个元素 even 表示偶数位置的子元素 odd 表示奇数位置的子元素 4) :first-of-type :last-of-type :nth-of-type 和:first-child这些非常相似,只...
一、:first-child、:last-child、:nth-child(n)、:only-child 子元素伪类选择器(第1类) 选择器 说明 E:first-child 选择父元素下的第一个子元素(该子元素类型为E,以下类同) E:last-child 选择父元素下的最后一个子元素 E:nth-child(n) 选择父元素下的第n个子元素或奇偶元素,n取值有3种:数字、odd和...
ul li:last-child { background-color: deeppink; } /* nth-child(n) 我们要第几个,n就是几 比如我们选第8个, 我们直接写 8就可以了 */ ul li:nth-child(8) { background-color: lightpink; } </style> </head> <body> <ul> <li>1</li> ...
css3 nth-child选择器 css3的nth-child选择器,乍看起来很简单,其实不是那么容易。 简单用法 p:nth-child(n) // 选择属于其父元素的第n个子元素的每个 <p> 元素 p:nth-child(2n) // 选择属于其父元素的子元素的每个偶数<p> 元素 p:nth-child(2n + 1) // 选择属于其父元素的子元素的每个奇数<p...
nth-child 选择器计算兄弟姐妹(即具有相同父元素的元素)。 在您的 HTML 结构中, div.social-logo 始终是 --- a --- 的第一个、最后一个和唯一的孩子。所以 nth-child 只有一个元素要计算。 但是,有多个锚元素,它们都是兄弟元素( #social-links 的子元素),因此 nth-child 可以定位每个元素。 #social-li...
.nav li:nth-child(2) a { color: #ff0000},这个能让<ul class='nav'>标签里面的第二个li的a标签的颜色变为红色。:nth-child用倍数比较好用。比如:nth-child(3n),只要是3的倍数的都会被选取（3，6，9...）
从奇数位置开始DIV可以通过CSS中的伪类选择器来实现。伪类选择器是一种用于选择元素的特殊选择器,可以根据元素在文档中的位置或状态来选择元素。 要从奇数位置开始DIV,可以使用nth-child伪类选择器。nth-child(n)选择器可以选择其父元素的第n个子元素。在这种情况下,我们可以使用nth-child(odd)选择器来选择奇数位置...