gpt4 book ai didi

html - 子元素的 css 事件选择器异常

转载 作者:行者123 更新时间:2023-11-28 16:13:03 25 4
gpt4 key购买 nike

<分区>

我有一个 div 带有 :active 选择器效果,这个 div 包含一个子 div,它包含一些按钮

现在 - 当然 - 当父 div 被点击时, :active 效果将被触发,而且当子 div 中的按钮之一被点击时点击了同样的事情发生,这是我不希望的,(感觉客人既点击了按钮又点击了父级div,很烦人)

我想要的是::active 效果仅在单击父 div 时触发,而不是在子 div 中的元素之一被单击时触发点击。是否可以?我不介意使用 JS 或 jQuery。

在下面的示例中,无论我单击 div 还是其中的按钮,边框都会变为红色:

#parent-div {
border: 1px solid black;
width: 300px;
height: 300px;
}
#parent-div:active {
border: 3px solid red;
}
#child-div {
position: absolute;
top: 20px;
left: 20px;
}
<div id="parent-div">
<div id="child-div">
<button>Hello</button>
</div>
</div>

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com