<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />

wap手机页面自动适应手机屏幕宽度

 大 | 中 | 小  2012/08/25 17:51 , mdy 
Css 重构 , 评论(0) , 阅读(5969) , Via 本站原创 
Tags: wap页面自适应宽度 , 手机页面宽度 , wap
  1. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
  1. 在网页的<head>中增加以上这句话，可以让网页的宽度自动适应手机屏幕的宽度。
  2. 其中：
  3. width=device-width ：表示宽度是设备屏幕的宽度
  4. initial-scale=1.0：表示初始的缩放比例
  5. minimum-scale=0.5：表示最小的缩放比例
  6. maximum-scale=2.0：表示最大的缩放比例
  7. user-scalable=yes：表示用户是否可以调整缩放比例
  8. 如果是想要一打开网页，则自动以原始比例显示，并且不允许用户修改的话，则是：
  9. [html] view plaincopy
  10. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  11. 这样子写后，就可以把一些页头横幅等的图片的宽度都设置成style="width:100%"，整个页面在设备上看起来就是全屏的了
  1. html5开发的wap网站这三个分别代表什么含义？
  2. <meta name="MobileOptimized" content="240"/> //浏览器不会自动调整文件的大小,不会随着浏览器拉伸缩放。
  3. <meta name="apple-touch-fullscreen" content="YES" />"添加到主屏幕“后，全屏显示
  4. <meta name="apple-mobile-web-app-capable" content="yes" />
  5. 如果内容设置为YES，Web应用程序运行在全屏模式;否则，它不会。默认行为是使用Safari浏览器显示网页内容

手机wap适配的更多相关文章

  1. 了解真实的『REM』手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  2. 老李分享：android手机测试之适配（1）

    Android的屏幕适配一直以来都在折磨着我们这些开发者,本篇文章以Google的官方文档为基础,全面而深入的讲解了Android屏幕适配的原因.重要概念.解决方案及最佳实践,我相信如果你能认真的学习 ...

  3. 手机wap网站建设的方法和技巧

    随着互联网技术的不断进步,越来越多的运营商对于手机wap网站的建设有了更多的投入,手机wap网站的建设和开发要根据网站的特点和经营范围来进行设计和建设,这样才可以提升手机wap网站建设的效果.现在智能 ...

  4. 微信跳转，手机WAP浏览器一键超级跳转微信指定页面

    微信跳转,手机WAP浏览器一键超级跳转微信指定页面 这篇文章主要介绍了如何在手机浏览器wap网页中点击链接跳转到微信界面,需要的朋友可以参考下 先说第一种,最简单的唤起微信协议,weixin://主流 ...

  5. 了解真实的rem手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  6. selenium+python自动化84-chrome手机wap模式（登录淘宝页面）

    前言 chrome手机wap模式登录淘宝页面,点击验证码无效问题解决. 切换到wap模式,使用TouchActions模块用tap方法触摸 我的环境 chrome 62 chromedriver 2. ...

  7. 【Android】Android中不同手机分辨率适配问题

    在项目开发的过程中,同一个布局对应不同的手机会显示出不同的效果.导致这个现象产生的原因是不同手机的分辨率不同.在android sdk提供的帮助文档中,我们可以看到各种手机的分辨率和对应的屏大小.QV ...

  8. 真实的『REM』手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  9. php获得访问来源（手机wap访问、电脑web访问）

    为了更好的用户体验,本主题默认支持wap和web两种访问样式,wap访问将不包含任何脚本.样式也是重新撰写,不支持更多页面,只支持首页.详情页, 评论框.登录等内容将陆续更新到wap内容里.如果想测试 ...

随机推荐

  1. redis主从集群搭建及容灾部署(哨兵sentinel)

    Redis也用了一段时间了,记录一下相关集群搭建及配置详解,方便后续使用查阅. 提纲 Redis安装 整体架构 Redis主从结构搭建 Redis容灾部署(哨兵sentinel) Redis常见问题 ...

  2. Idea2018激活破解

    原文:https://www.imsxm.com/2018/07/idea-2018-1-5-crack-patcher.html 最近更新了Intellij IDEA到2018.1.5之后,使用之前 ...

  3. Informix 常用函数

    一.内部函数 1.内部合计函数 1)COUNT(*) 返回行数 2)COUNT(DISTINCT COLNAME) 返回指定列中唯一值的个数 3)SUM(COLNAME/EXPRESSION) 返回指 ...

  4. Codeforces 394D Physical Education and Buns 胡搞

    题目链接:点击打开链接 题意:给定n个数的序列(能够排序) 操作一次能够使得某个数++或--. 问最少操作几次使得序列变成一个等差序列 输出: 第一行输出最少操作的次数 第二行输出等差数列里的最小项 ...

  5. ios成长之每日一遍(day 7)

    今天到UITabBarController 结合 UIPickView, 这里一共有5个实现, 由浅到易. 其实在IB上面使用UITabBarController很简单, 就像平常拖控件一样拖到界面上 ...

  6. c# action<> func<> 这2个委托怎么用和理解

    其实很好理解的呢!~首先你需要明白,他们是委托的简写形式. 一.[action<>]指定那些只有输入参数,没有返回值的委托 1.1定义一个委托: 比如,我们原来写委托: public de ...

  7. MYSQL中group_concat有长度限制！默认1024(转载)

    在mysql中,有个函数叫“group_concat”,平常使用可能发现不了问题,在处理大数据的时候,会发现内容被截取了,其实MYSQL内部对这个是有设置的,默认不设置的长度是1024,如果我们需要更 ...

  8. 使用kubectl创建部署

    本文使用自己利用VirtubalBox搭建的集群环境,暂时只有一个Master.一个Node.如果想了解集群的搭建,可以参考我的文章离线环境安装Kubernetes集群以及使用kubeadm安装kub ...

  9. ubuntu下如何批量修改文件后缀名

    正确的方法是: 在命令行中输入   rename   's/\.JPG/.jpg/'    *.JPG [注意] 在单引号中的最后一个'/'符号不能少! 意思是:把当前文件夹下的所有 .JPG文件 替 ...

  10. [PowerShell Utils] Remotely install Hyper-V and Failover Cluster feature on a list of windows 2012 servers

    Hello everyone, this is the second post of the series. .   Background =============== In my environm ...