jquery - 响应式 div 关系

Question

我有 2 个 div，里面有一些元素。

我想在宽度>600px时显示一个div并隐藏另一个，当宽度>600px时隐藏一个div并显示另一个。我试过这段代码，但它不起作用:

@media (min-width: 601px) { 


 .organigramma-desktop {   
display: inline;
}

.organigramma-mobile {   
 display: none;
}}



@media (max-width: 600px) { 

 .organigramma-desktop {   
   display: none;
 }
  .organigramma-mobile {   
 display: inline;
 }
 }

谢谢

Answer 1

媒体查询应用于现有样式之上，因此您应该定义桌面样式并仅在需要时添加移动样式

.organigramma-desktop {   
    display: inline;
}

.organigramma-mobile {   
    display: none;
}

@media (max-width: 600px) { 
     .organigramma-desktop {   
       display: none;
     }

     .organigramma-mobile {   
        display: inline;
     }
 }