如何根据使用Angularjs或css的内容仅在手机上隐藏div（总是必须显示大屏幕）答案

【问题标题】：How to hide a div only on mobiles(large screen always has to be displayed) based on a content using Angularjs or css如何根据使用Angularjs或css的内容仅在手机上隐藏div（总是必须显示大屏幕）
【发布时间】：2018-07-08 10:14:40
【问题描述】：

根据使用 Angularjs 或 css 的内容，仅在手机上隐藏 div（总是必须显示大屏幕）

【问题讨论】：

基于内容是什么意思？
@media screen and (max-width: 480px) 解决您的问题？
不，它没有解决我的问题。基于内容意味着我从模型中获取值，即布尔值是否在移动设备上显示\隐藏 div

标签： css angularjs

【解决方案1】：

将 2000px 更改为 480px 或其他值，这取决于你

.box{
  width: 100px;
  height: 100px;
  background-color: blue;
  display: block;
}

@media screen and (max-width: 2000px){
  .box{
    display: none;
  }
  input:checked + .box{
    display: block;
  }
}

<input type="checkbox">
<div class="box">
</div>

【讨论】：

好的，如果你想为复选框设置样式，只需将其放在label 标签内，隐藏输入，然后用图像或 CSS 样式化标签
我的页面有多个复选框，所以设置不正确
你只需要给元素添加一个Id或者一个类，它们必须是并排的

【解决方案2】：

将 class= "divclass" 添加到您的 html 然后在您的 css 文件中：

@media (max-width:480px) {
  .divclass{
     display: none;
  }
}

【讨论】：