Home > Backend Development > PHP Tutorial > 如何让网站在某些特定分辨率浏览时可以自动缩放

如何让网站在某些特定分辨率浏览时可以自动缩放

WBOY
Release: 2016-06-06 20:40:15
Original
1337 people have browsed it

我的网站主体部分的宽度是960px,
在普通笔记本,普通显示器上显示效果都没问题,
但在小屏幕、高分辨率,比如surface3上面看的时候
两侧留白会很多。
在设备上缩放页面到140%,效果就和普通显示器一样了。
由于这样的设备,现在的用的也很少,
所以想问一下,应该如何让这样设备的访客,可以自动缩放到140%显示呢?

回复内容:

我的网站主体部分的宽度是960px,
在普通笔记本,普通显示器上显示效果都没问题,
但在小屏幕、高分辨率,比如surface3上面看的时候
两侧留白会很多。
在设备上缩放页面到140%,效果就和普通显示器一样了。
由于这样的设备,现在的用的也很少,
所以想问一下,应该如何让这样设备的访客,可以自动缩放到140%显示呢?

找个responsive方案,
市面上茫茫多的,
我的博客用的是雅虎的pure css,只分了2种情况。其实可以分更细。

<code><meta name="viewport" content="width=device-width">
</code>
Copy after login

配合 CSS media query 使用。

<code>@media (max-width: 1024px) {
    html {
        font-size: 22px;
    }
}
</code>
Copy after login

佈局使用 rem:

<code>body {
    max-width: 60rem;
}
</code>
Copy after login

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template