html - 缩小视口(viewport)

标签 html css

我正在尝试将视口(viewport)缩小到 0.8,以便高度低于 1080。

到目前为止,我已经这样做了:

HTML 头部

<meta name="viewport" content="width=device-width, initial-scale=1" />

CSS

@media screen and (max-height:1079px){
    @viewport {
        width: device-width;
        zoom: .8;
    }
}

没有前缀,因为我正在使用 firefox 对其进行测试。 有什么想法吗?

谢谢!

最佳答案

既然你提到了 Firefox,问题是 Firefox,从版本 37 开始,does not support @viewport 规则。由于 Firefox 有一个 Unresolved bug关于 2012 年的问题,您可能想尝试一种替代方法,例如将 font-size 减小到 .8em

如果你检查 Firefox 控制台,你会看到这个 css 错误:

Unrecognized at-rule or error parsing at-rule '@viewport'.

关于html - 缩小视口(viewport),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29608910/

相关文章:

javascript - 在 Laravel 中获取从 Javascript 到 HTML 的值(value)

javascript - 在 head 标签中动态添加一个 <link rel ="canonical"

css - Html5 Canvas 未调整大小以填充父 div

javascript - 如何使用 JavaScript 匹配网页上不在 <a> 及其 href 中的关键字?

html - Web 应用布局指南

php - 在 Yii 应用程序中的所有文本字段上添加默认类

javascript - 如何创建一个在单击时在两个值之间翻转的元素?

html - 如何在固定高度 <div> 的中间垂直对齐 <table>?

html - Div 定位无法正常工作

css - 如何将 CSS/SCSS 与 Vue 组件文件保持在一起