
获得徽章 0
赞了这篇沸点
css真的很奇妙!!
快放假了,希望滑水的朋友们可以看到,因为我怕我的卷大家看不到
~
能吃透这段代码,就能领悟 :not 和 :has 选择器的奇妙~~
以下这段是点击第4张元素,控制第3张元素的css代码(
你也可以理解为在第3张元素事先满足这些条件下,会有这种效果)。
.radio-item:nth-child(1):not(.radio:checked) + * + .radio-item:nth-child(3):not(.radio:checked):has(+ .radio-item .radio:checked) .item
1. 控制 /①元素(不是选中)+ ②元素(不是选中)+ ③元素(没有选中)但存在(+ ④元素被选中)/时满足以上条件的③元素样式;
2. 即便我们不能直接控制之前的元素,但是我们可以事先要求之前的元素满足一定条件,来达到提前预判;
code.juejin.cn
快放假了,希望滑水的朋友们可以看到,因为我怕我的卷大家看不到
![[白眼的狗]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_98.9f6d4ad.png)
能吃透这段代码,就能领悟 :not 和 :has 选择器的奇妙~~
以下这段是点击第4张元素,控制第3张元素的css代码(
.radio-item:nth-child(1):not(.radio:checked) + * + .radio-item:nth-child(3):not(.radio:checked):has(+ .radio-item .radio:checked) .item
1. 控制 /①元素(不是选中)+ ②元素(不是选中)+ ③元素(没有选中)但存在(+ ④元素被选中)/时满足以上条件的③元素样式;
2. 即便我们不能直接控制之前的元素,但是我们可以事先要求之前的元素满足一定条件,来达到提前预判;
展开
17
11
赞了这篇沸点
赞了这篇沸点
等等等……等一下,先别滑走
那个 屏幕前的陌生人
我不认识你
但我想祝你加油
祝你顺风顺水 祝你马到成功
祝你一生永远被爱
祝你遇良人,结婚生子
祝你遇贵人,事业有成
祝你平安喜乐
那个 屏幕前的陌生人
我不认识你
但我想祝你加油
祝你顺风顺水 祝你马到成功
祝你一生永远被爱
祝你遇良人,结婚生子
祝你遇贵人,事业有成
祝你平安喜乐
展开
1
26
赞了这篇文章
赞了这篇沸点