<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. [Asp.net mvc]Html.ValidationSummary(bool)

    摘要 对ValidationSummary是HtmlHelper的扩展方法,用来返回 System.Web.Mvc.ModelStateDictionary (即ModelState)对象中的验证消息 ...

  2. Linux ftp 命令

    一.ftp的get命令和mget命令有何不同? get一次只下载一个文件:mget一次可以下载多个文件,而且支持通配符,需要注意的是在mget的时侯,需要对每一个文件都选择y/n,如果想不交互的下载全 ...

  3. POJ 2135 Farm Tour &amp;&amp; HDU 2686 Matrix &amp;&amp; HDU 3376 Matrix Again 费用流求来回最短路

    累了就要写题解,近期总是被虐到没脾气. 来回最短路问题貌似也能够用DP来搞.只是拿费用流还是非常方便的. 能够转化成求满流为2 的最小花费.一般做法为拆点,对于 i 拆为2*i 和 2*i+1.然后连 ...

  4. SharePoint PowerShell 批量删除遗弃视图

    前言 最近,给SharePoint升级了,然后发现,有一大批视图不需要了,而且,名字是一样的,想着怎么清理,然后,就想到了powershell. powershell 示例: $siteUrl = & ...

  5. Swift - 绘制背景线条

    Swift - 绘制背景线条 效果 源码 // // BackgroundLineView.swift // LineBackgroundView // // Created by YouXianMi ...

  6. centos7更改为启动桌面或命令行模式

    进入cenos7的命令行模式 终端输入“init 3”回车进入命令行模式 登录成功后 # systemctl get-default //获取当前系统启动模式 查看配置文件 # cat /etc/in ...

  7. [Web 前端 ] Jquery attr()方法 获取或修改 对象的属性值

    cp from : https://blog.csdn.net/gf771115/article/details/18086707 jquery中用attr()方法来获取和设置元素属性,attr是at ...

  8. Java 集合细节（二）：asList 的缺陷

    在实际开发过程中我们经常使用 asList 讲数组转换为 List,这个方法使用起来非常方便,但是 asList 方法存在几个缺陷: 一.避免使用基本数据类型数组转换为列表 使用 8 个基本类型数组转 ...

  9. 多线程-Executors和Executor，线程池

    jdk1.5之前,所有的线程都是需要自己手动创建的,由jvm销毁,当请求过多的时候,频繁的创建和销毁线程是非常浪费资源的.jdk1.5为此做了优化,提供了 java.util.concurrent 包 ...

  10. CentOS 7 在vmware中的网络设置

    一环境说明 二centos在vmware中的安装 三NAT网络设置 四设置固定IP 1修改网卡配置说明 2修改etcresolvconf 实现域名解析 五设置防火墙iptables 1 centos安 ...