标签 javascript html css
<分区>
我有一个由 3 个部分组成的形状:
* ***************************** *
*** * * ***
***** * * *****
******* ***************************** *******
如上图所示，该形状由一个矩形和两个三 Angular 形(一个在左侧，一个在右侧)包围而成。
我希望每当用户将鼠标悬停在其任何一个组件上时，整个形状都会更改为相同的颜色。
我尝试过使用各种方法来完成这项任务，但收效甚微。
这是我目前拥有的 on JSFiddle .
形状有点不对劲，但我主要关心的是如何让悬停功能适用于我的对象。
即使我尝试在上面的 fiddle 中实现 JavaScript，我也会接受任何其他能让我的代码正常工作的替代方法。
最佳答案
我是这样做的:
<div class="container">
... your code
</div>
.container:hover .tabStyle{
background : #000;
border-color: #000;
}
.container:hover .slopeLeft, .container:hover .slopeRight{
border-bottom-color: #000;
}
其中 .container 是您的 div 的父元素
JSFiddle:http://jsfiddle.net/svzrkdu6/12/
关于javascript - 悬停时将 CSS 应用于多个组件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27693528/