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

我用css样式来控制页面,但是在ie5版权中页面没有缩放,原因是此版本没有缩放功能,但是怎样用网页制作代码才能解决高版本,或其他浏览器的随意缩放问题呢?

移动端页面禁止用户缩放界面只需加上<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 就可以

温馨提示:内容为网友见解,仅供参考
第1个回答  推荐于2019-09-28

1、进入注册表,按下列路径进入,HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Zoom 如下图所示。

2、在zoom项次右侧空白处点击鼠标右键---新建--REG_DWORD值 ,如下图所示。

3、右键新建的值,选择重命名,如下图所示。

4、将这个新建的值命名为ZoomDisabled ,如下图所示。

5、双击ZoomDisabled项次,进入设置界面,将REG_DWORD值设置为1,点击 确定按钮即可,如下图所示。

本回答被网友采纳
第2个回答  推荐于2017-09-15
html5默认允许用户缩放页面,如果需要禁止缩放,我们需要将user-scalabel=0设置下,具体代码如下:
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
注意:meta在head里。
第3个回答  2019-03-05
html5默认允许用户缩放页面,如果需要禁止缩放,我们需要将user-scalabel=0设置下,具体代码如下:
注意:meta在head里。
第4个回答  2014-03-16
怎么禁止呢css本回答被提问者采纳

怎样用html代码禁止浏览器缩放网页大小
alert('当前页面不是100%显示,请按键盘ctrl+0恢复100%显示标准,以防页面显示错乱!')}} \/\/阻止pc端浏览器缩放js代码 \/\/由于浏览器菜单栏属于系统软件权限,没发控制,我们着手解决ctrl\/cammond + +\/- 或 Windows下ctrl + 滚轮 缩放页面的情况,只能通过js来控制了 \/\/ jqeury version (document...

HTML 如何防止手机浏览页面点击输入框页面会自动放大问题?
(5)user-scalable:是否可对页面进行缩放,no 禁止缩放。2、苹果为了提高Safari中网站的辅助功能,屏蔽了Meta下的user-scalable=no功能。所以在iOS10下面,就算加上user-scalable=no,Safari浏览器也能支持手动缩放。所以只能用js加监听事件来阻止手动缩放。width=device-width :表示宽度是设备屏幕的宽度 ...

html,我把浏览器缩小,我的网页也跟着变小,请问应该怎么...
设置固定宽度就行了。

HTML问题textarea如何设置属性不可在网页中编辑大小
1、首先,打开html编辑器,新建html文件,例如:index.html。2、在index.html中的<body>标签中,输入html代码:<textarea style="resize:none"><\/textarea>。3、浏览器运行index.html页面,此时textarea在网页中的大小被固定不可修改。

在html中,怎么才能不让网页随着浏览器的放大缩小而有所改变
宽度不要使用百分比,直接给它一个固定的值。如:width="780px"

设计了一个html的静态网页,请问怎么设置才能让页面的大小不能由用户放大...
可以 去看一下css样式的设计,控制大小后,你再把网页右上角的最大化和最小化这两个按钮给去掉,当然这些方法可能在某些浏览器上是不支持的,所以你的注意一下

如何限制浏览器窗口的大小,寻求精华知识啊!!!
1.弹启一个全屏窗口 <html> <body onload="window.open(' http:\/\/www.e3i5.com ','example01','fullscreen');"> <b> www.e3i5.com <\/b> <\/body> <\/html> 2.弹启一个被F11化后的窗口 <html> <body onload="window.open(' http:\/\/www.e3i5.com ','example02','channelmod...

怎么限制打开的浏览器的窗口大小固定,且最大化按钮禁用
left=0 窗口距离屏幕左侧的象素值;toolbar=no 是否显示工具栏,yes为显示;menubar,scrollbars 表示菜单栏和滚动栏。resizable=no 是否允许改变窗口大小,yes为允许;location=no 是否显示地址栏,yes为允许;status=no 是否显示状态栏内的信息(通常是文件已经打开),yes为允许;<\/SCRIPT> ...

如何通过JS或其它手段禁用IE的缩放功能
从用户角度讲,这是他们应有的权利,它属于操作系统中应用软件的一部分,并不属于页面,你没有办法禁止用户对窗口进行缩放。有一个办法可以保证页面总是保持在你想要的尺寸:resizeTo IE 和 Safari 暂时还都支持在当前页面使用 resizeTo,其它浏览器都已经改为只支持在 window.open 打开的页面上使用。

求HTML指教,当浏览器窗口大小变化时,如何让内容布局不变
如果想要保持布局不变,可以给该元素(如div)设置最小宽度属性。在网页中,如果一个元素没有设置最小宽度(min-width),这时当浏览器缩小到一定程度时,元素中的布局可能会发生变化。设置代码如下:<html> <head> <title>主页面<\/title><style>body{ margin:0px; width:1350px; min-width...

相似回答