我正在我的一个页面上工作。目的是当我点击苹果的图像时，除了我的其他图像外，所有的东西都被设置为无显示。
下面是我的代码：
第一个
基本上，水果的div类中包含的所有图像（总共6个图像）都需要设置为“block”显示，其他所有图像都设置为none显示（当单击苹果图像时）。
因为主类中有很多div（和嵌套div），我想我可以将整个主类设置为显示none。然后，我可以将fruits类中的所有元素设置为显示block。我什至尝试在fruits类中使用！important关键字来覆盖将主div中的所有元素设置为none的效果，但似乎没有效果。
除了指定的一个，是否有任何方法可以将div的每个后代的css作为目标？
2条答案
按热度按时间kwvwclae1#
所有子元素都不可见，因为它们的父元素不可见;并不是因为它们继承了任何东西，而是因为包含它们的元素是不可见的。
！important值仅在您希望中断CSS层次结构时才适用;它与HTML层次结构无关。
在本例中，您希望在循环中分别为每个子级设置display属性;忘了父母吧。
cl25kdpy2#
您可以执行类似以下代码片段的操作。
请注意，我用占位符替换了您的图像
src，因为您的图像没有显示给我（和/或可能在某个时候停止显示）。它的编码是这样的，所有的图像都在一开始就显示出来，每次你点击一个，它就会隐藏自己，显示所有其他的。虽然不清楚你想达到什么目的，但这个行为至少应该说明你如何根据自己的需要设置它。
第一个