额外的CSS类：设置移动端某个元素不显示的代码

额外的CSS类：设置移动端某个元素不显示的代码

有些图片不想让他在移动端显示出来。可以用额外的css实现：



1：先在编辑页面的元素设置“额外的CSS类”

2：然后在后台-主题-自定义-额外的css文件里面加上：

@media only screen and (max-width: 800px) {
  .你设置的css类 {
      display: none !important;
  }
} 

 

自己测试一下吧。


恭喜你又学了一些没用的知识。



两张图片，两个元素并列显示的css：同样的道理。
 

@media only screen and (max-width: 800px) { 
 .你设置的css类 {
    width: unset !important;
    max-width: 49.7% !important;
    padding: 1px !important;
    margin: 0 !important;
  }
}

 

如果想在PC端不显示某个元素呢？
 

@media only screen and (min-width: 800px) {
  .pcpcpcpc {
      display: none !important;
  }
}

 

移动端单独控制元素 底部和上面间隙的css
 

@media only screen and (max-width: 800px) {
.bianjuli{
  margin-bottom: -70px;
}
}

p {
  margin-top: 100px;
  margin-bottom: 100px;
  margin-right: 150px;
  margin-left: 80px;
}
p{
   边距顶部：100px；
   底边距：100px；
   右边距：150px；
   左边距：80px；
}