css - CSS 伪类 active 行为类似于事件冒泡

Question

我是css的初学者。类似于 javascript 事件冒泡，当我应用伪代码活动类时，它的行为相同！

我的 HTML 为：

<div id="newContainer">
<span class="outerPara">I am outer para with <span class="innerPara">InnerPara</span> in me.</span>
</div>

和CSS：

#newContainer span.outerPara:active, #newContainer span.innerPara:active{
background-color: red;
}

在这里找到小提琴：http: //jsfiddle.net/sadepu/9M7ek/

当内部元素处于活动状态时，外部元素是否也处于活动状态？如果它处于活动状态，我们可以停止它吗？

score 0 · Accepted Answer

是的，CSS 伪选择器的工作方式与事件冒泡在 Javascript 中的工作方式几乎相同，尽管您不能 e.stopPropagation()在 CSS 中执行我们在 JS 中可以执行的操作。

如果您真的必须停止事件泡沫，我建议您采用 Javascript 方式:active并且可以通过mousedown ()&mouseup()事件进行模拟。

score 0 · Accepted Answer

外部元素始终与内部元素相连。我不能说它与事件冒泡完全一样，因为那不是我的强项，但我知道它们是相似的。

如果要关闭外部元素，请修改样式声明。您在外部和内部声明背景红色。仅针对内部。像这样：


#newContainer span.outerPara span.innerPara:active{
    background-color: red;
}

2 回答 2