jQuery 当另一个元素悬停时，如何从元素中删除框阴影效果？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18765264/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I remove a box-shadow effect from an element when another element is hovered?
提问by ariel
Structure:
结构：
<div class="box">
<div class="inner_box">
</div>
</div>
.inner_box has a box-shadow effect. When .box is hovered I want to remove shadow effect from .inner_box. Besides using JQuery, is there another way I can do this, preferably CSS3?
.inner_box 具有框阴影效果。当 .box 悬停时，我想从 .inner_box 中删除阴影效果。除了使用 JQuery，还有其他方法可以做到这一点，最好是 CSS3？
Please also show me examples of how i can do this in JQuery. Thanks!
还请向我展示如何在 JQuery 中执行此操作的示例。谢谢！
回答by Love Trivedi
回答by Tomzan
Here's a css only solution.
这是一个 css 唯一的解决方案。
.inner_box {
width: 100px;
height: 100px;
border: 1px solid black;
box-shadow: 1px 1px 1px black;
}
.box:hover .inner_box {
box-shadow: none;
}<div class="box">
<div class="inner_box">
</div>
</div>回答by Mark
You must reset the box-shadowback to its default state: none:
您必须将box-shadow其重置为默认状态none：：
.box:hover .inner_box {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
回答by Atchutha rama reddy Karri
Add this property on hover
在悬停时添加此属性
color: none;
