HTML 如何防止手机浏览页面点击输入框页面会自动放大问题

苹果手机... 苹果手机 展开
 我来答
小宁和大旭
2018-03-31 · TA获得超过1.1万个赞
知道小有建树答主
回答量:24
采纳率:0%
帮助的人:8601
展开全部

这个主要应用在手机端,有些网页的尺寸到了手机这里,页面尺寸就会缩小。如何保证手机看到的页面尺寸大小就是我们给网页设置的body长和宽呢?

方法如下:    

1、设置meta属性

  • content属性值 :

(1)width:可视区域的宽度,值可为数字或关键词device-width;

(2)height:同width;

(3)intial-scale:页面首次被显示是可视区域的缩放级别,取值1.0则页面按实际尺寸显示,无任何缩放;

(4)maximum-scale=1.0, minimum-scale=1.0:可视区域的缩放级别,maximum-scale用户可将页面放大的程序,1.0将禁止用户放大到实际尺寸之上;

(5)user-scalable:是否可对页面进行缩放,no 禁止缩放。

2、苹果为了提高Safari中网站的辅助功能,屏蔽了Meta下的user-scalable=no功能。所以在iOS10下面,就算加上user-scalable=no,Safari浏览器也能支持手动缩放。所以只能用js加监听事件来阻止手动缩放。

  • width=device-width :表示宽度是设备屏幕的宽度

  • initial-scale=1.0 :表示初始的缩放比例

  • minimum-scale=0.5 :表示最小的缩放比例

  • maximum-scale=2.0 :表示最大的缩放比例

  • user-scalable=yes :表示用户是否可以调整缩放比例

程经理
2024-10-11 广告
作为硕方科技(北京)有限公司的工作人员,关于移动智能标签打印机P50A设置放标签自动的步骤,通常涉及以下几个关键操作:1. **安装标签带**:首先,确保标签带已正确安装于打印机内,标签带需竖直放入,并确保标签带内标签已拉直,碳带不松弛。2... 点击进入详情页
本回答由程经理提供
0k
2013-12-17 · TA获得超过109个赞
知道答主
回答量:77
采纳率:0%
帮助的人:27.7万
展开全部
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

不知道这句会不会起作用,我没试过~
user-scalable=no这个是控制用户能否缩放的
追问
这个试过了  不起作用
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
zhengly0616
2015-10-08
知道答主
回答量:1
采纳率:0%
帮助的人:1179
展开全部
在head区加入:
<meta content="yes" name="apple-mobile-web-app-capable">
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2013-12-17
展开全部
去除浏览器边距 设置margin 0px atuo 这样就可以很好的让其一直居中不放大
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式