CSS Pseudo class 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 as：

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

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

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

Answer 1

是的，CSS伪选择器的工作方式与Javascript中的事件冒泡方式非常相似，尽管你不能在CSS中做e.stopPropagation()这样的事情。

如果您真的必须停止事件泡沫，我建议您使用Javascript方式＆amp; :active可以模仿mousedown ()＆amp; mouseup()事件。

Answer 2

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

如果要关闭外部元素，请修改样式声明。你在外部和内部宣称背景为红色。只针对内心。像这样：

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

http://jsfiddle.net/jalbertbowdenii/9M7ek/4/