HTML 禁止在移动端缩放

HTML About 1,011 words

需求

禁止网页在AndroidiOS、平板等设备中缩放,导致元素大小不一致。

方法

添加viewport,设置缩放属性。

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

示例

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>

<body>
    <div>
        this is very long text this is very long text this is very long text this is very long text this is very long
        text
    </div>
    <div>
        this is very long text this is very long text this is very long text this is very long text this is very long
        text
    </div>
    <div>
        this is very long text this is very long text this is very long text this is very long text this is very long
        text
    </div>
</body>

</html>
Views: 2,006 · Posted: 2021-06-23

————        END        ————

Give me a Star, Thanks:)

https://github.com/fendoudebb/LiteNote

扫描下方二维码关注公众号和小程序↓↓↓

扫描下方二维码关注公众号和小程序↓↓↓


Today On History
Browsing Refresh