单击后，多个元素使用伪选择器更改 CSS 和 HTML 中的属性答案

【问题标题】：After Click, Multiple Elements Changing Attributes in CSS and HTML using Pseudo Selector单击后，多个元素使用伪选择器更改 CSS 和 HTML 中的属性
【发布时间】：2013-08-05 05:36:53
【问题描述】：

没错，这个想法是在点击网页上的一个元素后，多个唯一的元素会改变它们的 CSS 属性（例如，一个 CSS3 动画）。

所以，这段代码可以工作，因为当点击选择器时，它会将文本变为红色

<style type="text/css">
p {
    font-size:20px;
    }

p:target {
    color:red;
    }

#selector{
    font-size:20px;
}

</style>
</head>
<body>
<p id="selector"><a href="#one">Click here to change text to red</a></p>

<p id="one"> This text will change to red </p>
</body>

但是你看，我想要发生的是当点击第一个选择器时另一个 div 也可能变为红色。我想不出办法来做到这一点。

我真正想做的是，当用户单击一个按钮时，会触发多个 CSS3 动画。

【问题讨论】：

标签： html css target css-animations pseudo-class

【解决方案1】：

你需要的是jQuery，比如this。

jQuery 也可以跨浏览器处理动画。 api.jquery.com/animate

【讨论】：

谢谢，我现在就使用它，但我通常知道，这是通过使用 JavaScript 完成的。使用它的缺点是我猜有几个资源在工作，所有这些资源都增加了客户端下载并减少了页面的速度。我认为使用 CSS3 可能会有更简单的解决方案。