实现场景描述:

有些内容部署在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. linux的端口学习(一)

    1.端口是什么? 1.1 是英文port的意译,可认为是设备与外界通讯交流的出口. 1.2 端口可分为虚拟端口和物理端口. 1.2.1 虚拟端口:指计算机内部或交换机路由器内的端口,不可见.例如计算机 ...

  2. 吴裕雄--天生自然SSH框架开发:搭建一个完整的SSH框架

    下载jar包 spring框架的jar包:https://repo.spring.io/ hibernate框架的jar包:http://hibernate.org/orm/ struts2框架的ja ...

  3. java获取tomcat中的properties文件

    System.getProperty("catalina.home") 获取tomcat的绝对路径 获取文件的绝对路径 在windous中拼接路径是" \ " ...

  4. IDEA & MAVEN配置代理(没用)

    1. IDEA配置代理: 2. maven配置代理: 在maven中配置代理,主要配置编辑~/.m2/settings.xml文件的<proxies> socks5类型: <id&g ...

  5. 对FPM 模块进行参数优化!

    Nginx 的 PHP 解析功能实现如果是交由 FPM 处理的,为了提高 PHP 的处理速度,可对FPM 模块进行参数跳转.FPM 优化参数:pm 使用哪种方式启动 fpm 进程,可以说 static ...

  6. 解决springmvc拦截器拦截静态资源的两种方式

    1.是采用<mvc:default-servlet-handler />,(一般Web应用服务器默认的Servlet名称是"default",所以这里我们激活Tomca ...

  7. tomcat配置限制ip和建立图片服务器

    1.配置限制ip访问 打开 tomcat里conf文件下的server.xml 在<Host name="localhost" appBase="webapps&q ...

  8. laravel nginx下 css 和js 加载 重写规则

    server { listen 80; server_name test.hanwen.com; #charset koi8-r; #access_log logs/host.access.log m ...

  9. pagehelper 分页不生效,总页数总是1解决方案

    问题: 后台查询后的数据只有1页,已经设置了PageHelper也没用 PageHelper.startPage(pageNum,pageSize); ModelAndView mv=new Mode ...

  10. Cookie信息保存到本地(MozillaCookieJar)

    from urllib import request from http.cookiejar import MozillaCookieJar cookiejar = MozillaCookieJar( ...