当hover h3的时候咋让父类c-container 变化,并却只能使用CSS?
目前并不可以。题主这是在给百度搜索结果写样式么……
■网友
父元素选择器不能用其他答主已经说了,但如果只是视觉上接近题主想要的效果的话,还是有一点点办法的:
+==== 不正经答题分界线 ====+.t, .t ~ *:last-child { transition-property: margin-top, padding-bottom; transition-duration: 200ms; transition-timing-function: ease-in-out;}.t:hover { margin-top: -5px;}.t:hover ~ *:last-child { padding-bottom: 5px;}.c-container { position: relative;}.t::after { content: \u0026#39;\u0026#39;; position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: box-shadow 200ms ease-in-out; z-index: -1;}.t:hover::after { box-shadow: 10px 10px 40px rgba(168, 182, 191, .7);}原理:负margin用法权威指南
关键点:
使用负 margin 代替 transform,因为 transform 会创建一个新的局部坐标系,导致我们无法生成一块与父元素等大的内容块(阴影)在最后一个兄弟元素上添加反向 padding 来补偿负 margin 缩减的空间(为什么不用 margin — margin collapse)效果图:
不足点:底部多出了 5px 的空隙
■网友
答案是:不能css能做的交互是有局限性的,不管是点击还是移入都是如此,当你发现css不能解决的时候请使用javascript。
■网友
【当hover h3的时候咋让父类c-container 变化,并却只能使用CSS?】 div 可以使用hover 特别尴尬
■网友
沒有選擇父元素的,你硬要用css只能扯自己的蛋,而且不能hover也不理解是什麼意思
推荐阅读
- 栖霞山@正是栖霞山赏枫好时候 栖霞丹枫似火若霞
- 想寒假的时候一个月在家准备计算机二级的office高级应用,但是不知道买啥书比较好~~~?
- 环球车讯网|终于等到了,奥德赛跌至21.98万元,是时候入手了
- 读书读到3分之一的时候感觉很难理解,要不要继续
- 销量|考验品牌力的时候到了,三缸雷凌开启预售,销量是增还是减?
- 考研的时候通过啥渠道获得自己需要的信息
- 在老板否定你的时候,怎样正确的表达出自己的看法
- 乱停车|海安江海清水园小区乱停车现象什么时候能管理好?
- 汽车知识|一汽-大众探岳和丰田荣放,谁买的时候更赚,卖的时候少亏?
- Rust 中循环啥时候使用loop 啥时候使用while true?
