最新文章:

首页 网站代码

手机窗口自适应代码

发布时间:2016年03月08日 评论数:抢沙发 阅读数:689

    在网页的<head>中增加以上这句话,可以让网页的宽度自动适应手机屏幕的宽度:

    [html] view plain copy
     在CODE上查看代码片派生到我的代码片
    1. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />     
    2. <meta name="apple-mobile-web-app-capable" content="yes" />    
    3. <meta name="format-detection" content="telephone=no" />    

    第一行: width=device-width :表示宽度是设备屏幕的宽度
    initial-scale=1.0:表示初始的缩放比例
    minimum-scale=0.5:表示最小的缩放比例
    maximum-scale=2.0:表示最大的缩放比例
    user-scalable=yes:表示用户是否可以调整缩放比例
    第二行:
    设定iphone端页面全屏。
    第三行:
    取消数字被识别为电话号码。

    如果是想要一打开网页,则自动以原始比例显示,并且不允许用户修改的话,则是:
    [html] view plain copy
     在CODE上查看代码片派生到我的代码片
    1. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />    

    这样子写后,就可以把一些页头横幅等的图片的宽度都设置成style="width:100%",整个页面在设备上看起来就是全屏的了。
二维码加载中...
本文作者:幻陆      文章标题: 手机窗口自适应代码
本文地址:http://www.hyunlu.com/?post=50
版权声明:若无注明,本文皆为“幻陆”原创,转载请保留文章出处。
挤眼 亲亲 咆哮 开心 想想 可怜 糗大了 委屈 哈哈 小声点 右哼哼 左哼哼 疑问 坏笑 赚钱啦 悲伤 耍酷 勾引 厉害 握手 耶 嘻嘻 害羞 鼓掌 馋嘴 抓狂 抱抱 围观 威武 给力
提交评论

清空信息
关闭评论
sitemap