.nav div:nth-last-of-type(-n+2) {
color: #fff;
background-color: red;
结构伪类选择器也可以组合使用,来满足PM大大的各种 “ 合理 ” 需求~
(现在开篇的案例是不是就很好理解啦~)
到这里,今天的结构伪类选择器的深度解析就讲完啦~ ❀撒花❀❀撒花❀❀❀❀❀
感谢你萌的耐心观看,这次是写的篇幅最长的一次了,呼~
码字不易,希望能对你萌的学习有所帮助!爱你们呦💗
其实哈,我自己在总结的时候,突然有一个想法,今天所讲的选择器都是以标签为基础进行选择的,那么能不能给标签加上统一的类名,选择器会对类名起作用吗!?!
比如这样.item:nth-child(n+3)
再或者这样的.item:nth-of-type(3)
以-of-type
结尾的选择器原理就是先筛选标签,那么遇上类名会发生什么?!?
陷入沉思ing ~ - ~
明天再更新这些问题吧!我也很期待会发生什么奇奇怪怪的事情🐞🐛🐞~
与后代选择器相比,子元素选择器(Child selectors)只能选择作为某元素子元素的元素。
选择子元素
如果您不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素,请使用子元素选择器(Child selector)。
例如,如果您希望选择只作为 h1 元素子元素的 strong 元素,可以这样写:
复制代码代码如下:h1 > strong {color:red;}
这个规则会把第一个 h1 下面的两个 strong 元素变为红色,但是第二个 h1 中的 strong 不受影响:
复制代码代码如下:<h1>This is <strong>very</strong> <stro
本文主要介绍了CSS选择第一个和倒数第一个元素的解决方法,这里用到了first-child和:last-child,本文结合示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下前端新手会遇到不知道如何选择列表中的第一个和倒数第一个元素,其实这非常简单。以后所有关于CSS选择的问题,都可以直接搜索CSS选择器的手册,里面有所有的CSS选择解决方法。今天主要介绍CSS如何选择第一个和倒数第一个元素,这里就需要用到和。
last-child 选择器匹配属于其父元素的最后一个子元素的每个元素。:not(selector) 选择器匹配非指定元素/选择器的每个元素。可以选择除了最后一个元素的所有元素。先用last-child选最后一个。正常情况下这样选择会全部选择。加上not就可以进行反选了。
在设计和开发Web应用程序时,有时我们需要选择除最后一个元素之外的元素内的所有子元素,那么如何使用CSS来选择元素中除最后一个之外的所有子元素?下面本篇文章就来给大家介绍一下,希望对大家有所帮助。
要使用CSS选择元素中除最后一个之外的所有子元素,可以使用使用:not和:last-child选择器。
element:not(:last-child) {
// CSS样式
css排除第一个子元素的方法:1、通过使用伪类选择器“:not”实现排除;2、通过使用“nth-of-type”或者“nth-child”实现排除;3、通过使用“+”或者“~”兄弟选择符实现获取排除第一个之外的子元素。本文操作环境:windows7系统、HTML5&&CSS3版、Dell G3电脑。css获取除第一个之外的子元素在前端页面开发中,需要使用css来选择除了第一个之外的...
先看一个简单的实例,首先是HTML部分:我是第1个p标签我是第2个p标签 然后两个选择器相对应的CSS代码如下:p:nth-child(2) { color: red; }p:nth-of-type(2) { color: red; }上面这个例子中,这两个选择器所实现的效果是一致的,第二个p标签的文字变成了红色:尽管上面两个demo的最后效果一致,但是两个选择器之间存在差异是必然的。对于:nt...