如何在我的代码中禁用页面缩放?我的意思是像这样缩放:
注意:我只希望它在 chrome 中工作。
代码如下:
*{
overflow: hidden;
}
.container {
overflow: hidden;
justify-content: center;
align-items: center;
}
.number-ticker {
position:absolute;
overflow: hidden;
top:0px;
left:0px;
color: #D9D9D9;
font-size: 2em;
font-family: Roboto Light;
overflow: hidden;
height: 1.1em;
background-color: transparent;
}
.number-ticker .digit {
overflow: hidden;
float: left;
line-height: 1;
transition: margin-top 0.75s ease-in-out;
text-align: center;
}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Number Ticker</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="number-ticker.css">
</head>
<body>
<div class="container">
<div class="number-ticker" data-value="10"></div>
</div>
<script src="number-ticker.js"></script>
</body>
</html>
我在 HTML head 中使用了这些但没有成功...
<meta
name='viewport'
content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0'
/>
还有这个:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
但不幸的是,它仍然缩放...!!!我错过了什么吗?
我看到过根本无法缩放的页面...所以我知道应该有一种工作方式...
最佳答案
我以前也遇到过这个问题,我认为 Chrome 会忽略“user-scalable=no”(至少在台式机上是这样)。
关于html - 如何在 Chrome 中禁用页面缩放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58825229/