html制作页面中如何禁止浏览器缩放？

html5默认允许用户缩放页面，如果需要禁止缩放，我们需要将user-scalabel=0设置下，具体代码如下：

成都创新互联成都网站建设定制设计，是成都网站营销推广公司,为发电机租赁提供网站建设服务,有成熟的网站定制合作流程，提供网站定制设计服务：原型图制作、网站创意设计、前端HTML5制作、后台程序开发等。成都网站制作热线：18982081108

meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /

注意:meta在head里。

怎样用html代码禁止浏览器缩放网页大小

移动端页面禁止用户缩放界面只需加上meta name="viewport" content="user-scalable=0"即可。

但是pc端确实比较麻烦，用户可以通过如下几种方式来缩放：

//具体实现demo:

!DOCTYPE html

html

head

meta http-equiv="Content-Type" content="text/html; charset=UTF-8"

title浏览器网页内容的百分比缩放（按Ctrl和+号键或者-号键的缩放）/title

style type="text/css"

/style

/head

body

a href="javascript:;" id="openApp"知乎客户端/a

input type="text" name="ee" autocomplete="on"

/body

/html

script type="text/javascript" src="js/jquery-1.11.3.min.js"/script

script type="text/javascript"

// 判断pc浏览器是否缩放，若返回100则为默认无缩放，如果大于100则是放大，否则缩小

function detectZoom (){

var ratio = 0,

screen = window.screen,

ua = navigator.userAgent.toLowerCase();

if (window.devicePixelRatio !== undefined) {

ratio = window.devicePixelRatio;

}

else if (~ua.indexOf('msie')) {

if (screen.deviceXDPI screen.logicalXDPI) {

ratio = screen.deviceXDPI / screen.logicalXDPI;}}

else if (window.outerWidth !== undefined window.innerWidth !== undefined) {

ratio = window.outerWidth / window.innerWidth;}

if (ratio){

ratio = Math.round(ratio * 100);}

return ratio;

};

//window.onresize 事件可用于检测页面是否触发了放大或缩小。

$(function(){

//alert(detectZoom())

})

$(window).on('resize',function(){      isScale();

});

//判断PC端浏览器缩放比例不是100%时的情况

function isScale(){

var rate = detectZoom();

if(rate != 100){

//如何让页面的缩放比例自动为100,'transform':'scale(1,1)'没有用，又无法自动条用键盘事件，目前只能提示让用户如果想使用100%的比例手动去触发按ctrl+0

console.log(1)

alert('当前页面不是100%显示，请按键盘ctrl+0恢复100%显示标准，以防页面显示错乱！')

}} 

//阻止pc端浏览器缩放js代码

//由于浏览器菜单栏属于系统软件权限，没发控制，我们着手解决ctrl/cammond + +/- 或 Windows下ctrl + 滚轮 缩放页面的情况，只能通过js来控制了

// jqeury version

$(document).ready(function () {

// chrome 浏览器直接加上下面这个样式就行了，但是ff不识别

$('body').css('zoom', 'reset');

$(document).keydown(function (event) {

//event.metaKey mac的command键

if ((event.ctrlKey === true || event.metaKey === true) (event.which === 61 || event.which === 107 ||

event.which === 173 || event.which === 109 || event.which === 187  || event.which === 189)){

event.preventDefault();    }

});

$(window).bind('mousewheel DOMMouseScroll', function (event) {

if (event.ctrlKey === true || event.metaKey) {

event.preventDefault();    }  });});

/script

扩展资料：

width             - viewport的宽度

height            - viewport的高度

initial-scale     - 初始的缩放比例

minimum-scale     - 允许用户缩放到的最小比例

maximum-scale     - 允许用户缩放到的最大比例

user-scalable     - 用户是否可以手动缩放

如果要禁止页面缩放，只要把user-scalable 设置成no 就可以

jsp页面如何禁止缩小？变态测试啊，说页面缩太小了就有问题了 求解救。。

meta name="viewport" content="width=device-width,minimum-scale=1.0, maximum-scale=2.0" /

html5默认允许用户缩放页面，如果需要禁止缩放，我们需要将user-scalabel=0设置下，具体代码如下：

meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;"/

测试成功

手机html5页面缩放问题

手机页面最好不要用实打实的宽的来写，不同手机上面的宽度显示是不同的。百分比是最好的选择，或者你写成响应式

用html5做的登陆界面，使用键盘之后改变屏幕大小

“屏幕键盘”，单击“开始”，指向“所有程序”，“附件”，“辅助工具”，然后单击“屏幕键盘”。这是开关等客

如果这个方法不起作用，那么你试试下面的例子

在里面开始---运行中输入：msconfig并选择弹出屏幕启动项，在下面的刻度是你引导他们将开始的东西，你把屏幕上的键盘，钩取消，然后重新启动等等，（注：有这个名字，如果你不这样做知道，问百度搜索，应该能找到）

那么它是简单易用的引导选项屏幕键盘客点内找到优化优化大师重启开机速度后，确定就好了

我用html5做的手机页面在iphone上测试时字体和电脑上一样,不自动缩放呢

你应该是加了一行类似 meta name="viewport" content="width=device-width; initial-scale=1.0" 这样的代码吧。

这个的意思是在所有媒体下浏览都会按照你样式定义的大小进行渲染，而不会对页面进行缩放，去掉就可以了。

分享名称：html5禁止缩放,浏览器禁止缩放
网址分享：http://myzitong.com/article/phjpdi.html