我怎么能隐藏一堂课

Question

我在两个html页面上都使用了CSS布局.

我想使用相同的样式,除了我想隐藏/禁用其他classes为第二个html页面制作的样式,并仍然使用第一个html页面上的其他.

情况:

class="firstClass"有我想要的字体和样式,但有其他classes和样式显示我使用它class.

我尝试通过在第一个类的同一级别添加secondClass来获取其他类,然后执行此操作:

.firstClass .secondClass, .dontWant1 .dontWant2 {
    display:none;
}

问题是它还隐藏在第一个html上.

Answer 1

您可以在一个元素上拥有多个类.也就是说,您在一个页面上添加了不在另一个页面上添加的类,以显示第1页上的元素并在第2页上隐藏它们.

您可以拥有该类show或dontshow定义哪些元素可见.

然后添加一个类来定义样式.

HTML/CSS:

.greenbox {
  background-color: green;
  width: 100px;
  height: 100px;
}

.redbox {
  background-color: red;
  width: 20px;
  height: 20px;
}


.show {
  display: block;
}
.dontshow {
  display: none;
}

<div class="greenbox">
  
  <div class="show">
    <div class="redbox">
      <!-- red box visible -->
    </div>
  </div>


  <div class="dontshow">
    <div class="redbox">
      <!-- red box not visible -->
    </div>
  </div>

  <div class="dontshow redbox">
      <!-- red box not visible -->
      <!-- exactly the same outcome as the above without the wrapping div -->
  </div>
  
</div>