实现场景描述:

有些内容部署在PC端但是有不适合在手机端显示(比如盒子过大,遮挡内容)或者手机端显示毫无意义等。我们可以使用下面的代码来实现:电脑端显示,手机端隐藏

实现方法:

CSS控制判断

@media screen and (max-width: 1221px) { .wapnone{display:none; }
}

在需要隐藏的区域加一个DIV,代码如下:

<div class="wapnone">你要css判断隐藏的内容</div>

的1221px表示如果屏幕尺寸达到了1221像素以下将会隐藏否则显示。具体数值可以自行调试)

本文源自: 钻芒博客

原文链接: https://www.zmki.cn/5001.html

自动PC端显示 手机端隐藏CSS代码判断实现的更多相关文章

  1. 山西大同大学教务处学生端--送给学弟,学妹的礼物,可在PC端,手机端操作

    解决问题:大同大学教务处官网学生端口一进去就卡住了,点上面一行的菜单无响应 转眼已是四年,想想自己大学即将结束,不由得让人感慨啊.这才刚开学几天,我就听到有同学在因为补考,选课的事情发愁.学校官方的教 ...

  2. 【工具】PC端调试手机端 Html 页面的工具

    一.概述 有一个项目需要在手机端显示一个 web 页面,而每次把应用 launch 后,从手机端看比较麻烦,因此搜罗了几种在 PC 端调试手机端页面的工具. 二.工具 http://fonkie.it ...

  3. 判断浏览器是pc端还是手机端

    1. 判断浏览器是pc端还是手机端 <script type="text/javascript"> var browser = { versions: function ...

  4. js 判断pc端或手机端

    <script> (function () { var navUA = navigator.userAgent; var defIncludeStr = "iPhone|Andr ...

  5. 关于PC端与手机端随着手指移动图片位置放生变化的拖拽事件

    当按下鼠标时,图片随鼠标移动松开时图片回到原位 drag("div_id") function drag(node_id){ var node = document.getElem ...

  6. 山西大同大学教务处教师端——可在PC端,手机端操作

    解决问题:大同大学教务处官网教师端口一进去就卡住了,点上面一行的菜单无响应 下载方法(学生端 / 教师端  / 验证脚本): 链接:https://pan.baidu.com/s/1MWrJXoPzE ...

  7. 自动判断PC端、手机端跳往不同的域名JS实现代码

    输入相同域名,在pc端和移动端会出现不同的页面效果,一种是用栅格系统实现自适应, 更多的是设计两套不同的模板和两个二级域名或者一个主域名和一个二级域名(就是有区别就可以了); js代码判断浏览器的用户 ...

  8. Charles PC端和手机端抓取HTTP和HTTPS协议请求、HTTPS通用抓包规则

    一:HTTP和HTTPS的区别 HTTP是超文本传输协议,被用在Web浏览器和网站服务器之间传递信息,HTTP协议以明文方式发送内容,不提供任何方式的数据加密,因此HTTP协议不适合传输一些敏感信息, ...

  9. 判断是pc端还是手机端,并跳转到相应页面

    <!-- 判断浏览器是否为手机端 -->  <script>     // class     ! function(navigator) {         var user ...

随机推荐

  1. mysql修改字符集为utf8

    https://zhidao.baidu.com/question/1642165712897935220.html

  2. java代码开启关闭线程(nginx)

    源码: import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; pub ...

  3. Java IO流详解(一)——简单介绍

    文件在程序中是以流的形式来传输的.所以用Java来传输文件就得使用到Java IO流. 1.流的概念和作用 流:代表任何有能力产出数据的数据源对象或者是有能力接受数据的接收端对象<Thinkin ...

  4. 关于calendar修改前的代码和修改后的代码

    Java编写的日历,输入年月,输出这个月的日期与星期 修改前的代码: import java.io.BufferedReader; import java.io.IOException; import ...

  5. GitHub vs. Bitbucket 不只是功能不同

    https://www.oschina.net/translate/bitbucket-vs-github-its-more-than-just-features 让我们回到2005年,Bitkeep ...

  6. adblock广告过滤

    1.在 img的 src中 出现 ad连在一起的情况,会被adblock过滤掉. 例如 <img id="adasdd" class="ad_mina" ...

  7. spring aop @after和@before之类的注解,怎么指定多个切点

    有如下两个切点: @Pointcut("execution(public * com.wyh.data.controller.DepartmentController.*(..))" ...

  8. Vulnhub_DC8 记录

    目录 DC8 经验 & 总结 步骤流水 信息搜集 80端口 获取Shell 提权 DC8 经验 & 总结 对页面的功能和对应的url要敏感. 所有的功能都要测试,要雨露均沾. 提示说的 ...

  9. 深入理解 ajax系列第一篇(XHR 对象)

    1999年,微软公司发布了IE5, 第一次引入新功能:允许javascript 脚本向服务器发起 hffp 请求.这个功能方式并没有被引起注意,知道2004年 Gmail 发布和 Google Map ...

  10. 科普:为什么 String hashCode 方法选择数字31作为乘子

    作者:coolblog 此文章转载自:https://segmentfault.com/a/1190000010799123 1. 背景 某天,我在写代码的时候,无意中点开了 String hashC ...