页面适应电脑和手机屏幕initial-scale 1：0 user-scalable=yes
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
在网页的<head>中增加以上这句话，可以让网页的宽度自动适应手机屏幕的宽度。
其中：
width=device-width ：表示宽度是设备屏幕的宽度
initial-scale=1.0：表示初始的缩放比例
minimum-scale=0.5：表示最小的缩放比例
maximum-scale=2.0：表示最大的缩放比例
user-scalable=yes：表示用户是否可以调整缩放比例
如果是想要一打开网页，则自动以原始比例显示，并且不允许用户修改的话，则是：
- <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%"，整个页面在设备上看起来就是全屏的了。
页面适应电脑和手机屏幕initial-scale 1：0 user-scalable=yes的更多相关文章
- asp.net 页面，文字自适应手机屏幕
(1)在<head>和</head>之间插入代码. <meta name="viewport" content="width=device- ...
- js实现仿华为手机计算器，兼容电脑和手机屏幕
效果图: 电脑端: 手机端: 源码: <!DOCTYPE html> <html lang="en"> <head> <meta char ...
- JS获取电脑或手机屏幕的分辨率
s = " 屏幕分辨率的高:"+ window.screen.height+"\n"; s += " 屏幕分辨率的宽:"+ window.s ...
- flexible.js在华某为手机上使用rem时，页面宽度超出手机屏幕宽度
问题:手机端项目在华为的某款手机上显示时页面内容没有自适应手机宽度,出现横向滚动条 原因:手机获取手机屏幕宽度并计算出rem时出现偏差,明显宽余真实手机屏宽度 解决方案一:在页面里获取页面最外层dom ...
- 移动页面HTML5自适应手机屏幕宽度
标签: 网上关于这方面的文章有很多,重复的东西本文不再赘述,仅提供思路,并解释一些其他文章讲述模糊的地方. 1.使用meta标签,这也是普遍使用的方法,理论上讲使用这个标签是可以适应所有尺寸的屏幕的, ...
- 移动端H5页面自适应手机屏幕宽度
1.由于本人使用的是sublime.text,使用rem就可以达到效果. 点击菜单中的preferences下的browse packages,选择cssrem-master,添加或者编写cssrem ...
- 在电脑上操作手机屏幕scrcpy工具就搞定了
手机安卓版本:10 电脑:win64 使用步骤 电脑步骤 下载scrcpy scrcpy 是免费开源的投屏软件,支持将安卓手机屏幕投放在 Windows.macOS.GNU/Linux 上,并可直接借 ...
- 相机拍的图，电脑上画的图，word里的文字，电脑屏幕，手机屏幕，相机屏幕显示大小一切的一切都搞明白了！
相机拍的图,电脑上画的图,word里的文字,电脑屏幕,手机屏幕,相机屏幕显示大小一切的一切都搞明白了! 先说图片X×dpi=点数dotX是图片实际尺寸,简单点,我们只算图片的高吧,比如说拍了张图片14 ...
- web页面自适应手机屏幕宽度
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scal ...
随机推荐
- MyBatis 接口的使用
为了简化MyBatis的使用MyBatis的使用,MyBatis提供了接口方式自动化生成调用过程,可以大大简化MyBatis的开发 开发映射文件: <select id="queryO ...
- 服务网关zuul之四：zuul网关配置
禁用过滤器在Zuul中特别提供了一个参数来禁用指定的过滤器,该参数的配置格式如下:zuul.AccessFilter.pre.disable=true动态加载动态路由通过结合Spring Cloud ...
- [ZZ]知名互联网公司Python的16道经典面试题及答案
知名互联网公司Python的16道经典面试题及答案 https://mp.weixin.qq.com/s/To0kYQk6ivYL1Lr8aGlEUw 知名互联网公司Python的16道经典面试题及答 ...
- kubernetes k8s yum localinstall
localinstall 是安装在本地的rpm包顺便解决依赖关系 yum localinstall docker-common-1.12.6-68.gitec8512b.el7.centos.x86_ ...
- Jmeter（十）检查点
检查点又名断言,我们在手工测试过程中肉眼以及自己的逻辑思维对实际结果进行判断是否与预期结果一致,但是工具是死的,没有眼睛,没有思维,并不知道需要判断的信息在哪块,或者是来判断什么东西,我们需要让工具更 ...
- IBM MQ 中 amqsput : command not found的解决办法
MQ操作队列的命令有如下三条:命令功能1.amqsput 将消息放入队列中, 程序把之后的每一行标准输入作为一条独立的消息,读到 EOF 或空行时退出.注意,UNIX 上的 EOF 为 Ctrl+ ...
- Java基础知识_毕向东_Java基础视频教程笔记(26 反射)
Java反射机制: 是在运行状态中,对于任意一个类(class)文件,都能够知道这个类的所有属性和方法,对于任意一个对象,都能够调用它的任意一个方法和属性.这种动态获取的信息以及动态调用对象的方法的功 ...
- java使用jedis访问CentOS中的redis
pom.xml <dependency> <groupId>redis.clients</groupId> <artifactId>jedis</ ...
- 绘制字母和数字组合的验证码（原生php）
<?php $font = array('font/FZZQJW.TTF','font/STHUPO.TTF');//字体 $str = '689acdefhjkmnpqrtuvwxyACDEF ...
- 「NOI2018」屠龙勇士(CRT)
/* 首先杀每条龙用到的刀是能够确定的, 然后我们便得到了许多形如 ai - x * atki | pi的方程 而且限制了x的最小值 那么exgcd解出来就好了 之后就是扩展crt合并了 因为全T调了 ...