(CSS):我可以通过触发一个事件或两个事件包含的类名来同时触发两个CSS事件吗?

( css ): can i trigger two of css events simultaneously by just triggering one event or the class name that two of events are included?

本文关键字:事件 CSS 两个 包含 一个 可以通过      更新时间:2023-09-26

这是一张描述图片。

我想要两个区域背景得到黄色背景。但它只工作时,鼠标在"这是实际区域",它不工作在"section_tr_inbody区域"

在section_tr_inbody区域,黄色背景仅部分有效

我的代码有什么问题?

(CSS)

#Actual {
            padding: 20px;
            font-weight: bold;
        }

.together:hover  {
    background-color: yellow;
    }

(HTML)

    (...)
    <tr id="section_tr_intbody" class="together">
    (...)


(...)
<div class="Slider slideup"> 
      <div id="Actual" class="together">
(...)

两个元素中的每一个都有相同的类名'together',我认为这应该是好的:1)CSS捕获其中一个元素,然后2)它同时对两个元素应用效果

在实际端,css捕获<div id="Actual" class="together">然后同时应用效果

另一方面,

<tr id="section_tr_intbody" class="together">侧,css捕获<tr id="section_tr_intbody" class="together">,但其应用效果不包括实际侧。

谢谢

我不认为这可以只通过CSS完成,因为你不能遍历DOM与CSS。

可以用jquery很容易做到这一点:

$('.together').hover(function() {
        $('.together').addClass('yellow');
  },
   function(){
        $('.together').removeClass('yellow');
  });
#Actual, #fake, #random {
            padding: 10px;
            font-weight: bold;
        }
td { padding: 10px; }
.yellow {
    background-color: yellow;
    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tr id="section_tr_intbody" class="together">
       <td>Table cell stuff</td>
      </tr>
    <tr id="section_tr_intbodyagain" class="nottogether">
       <td>More table cell stuff</td>
      </tr>
    <tr id="section_tr_intbodystill" class="together">
       <td>Even more table cell stuff</td>
      </tr>
    </table>
<div class="Slider slideup"> 
      <div id="Actual" class="together">
        Div stuff
        </div>
      <div id="fake" class="nottogether">
       more Div Stuff
       </div>
      <div id="random" class="together">
       Even more Div Stuff
       </div>
 </div>