调整网页大小以适应访问者的显示器分辨率

Re-size web pages to suits visitors monitor resolution

本文关键字:访问者 显示器 分辨率 网页 调整      更新时间:2023-09-26

我设计了一个网站。我想知道是否可以使我的网站中的页面重新调整大小以适应访问者的显示器分辨率。

例如,我正在使用分辨率为 1024x768 的计算机。如果我将分辨率更改为 800x600,我希望我的网站重新调整大小以适应 800x600 的屏幕分辨率。

是的,它被称为响应式设计。具体来看媒体查询。

称为"动态"或"流体"宽度,而不是在页面上设置"固定"宽度。这通常是用CSS完成的,而不是PHP或JavaScript。在谷歌上做一些关于这个主题的研究(搜索"动态宽度网页")。我找到了这篇文章。

您不想要分辨率,因为不是每个人都使用浏览器全屏显示;您想要文档大小。 有一些方法可以在普通的javascript中做到这一点,但最好的选择是使用像jquery这样的库,因为这有助于确保你的技术跨浏览器工作:

http://api.jquery.com/width/

但是不要这样做,除非没有其他方法可以做你想做的事情;首先尝试在你的CSS中使用百分比。 使用 js 设置大小很混乱。

这是

您搜索的内容的一些关键字

CSS 网格系统响应式/自适应 Web

一些链接

http://net.tutsplus.com/tutorials/design-tutorials/quick-tip-different-layouts-for-different-widths/

http://speakerdeck.com/u/nathansmith/p/960-grid-system

http://www.emblematiq.com/lab/my-adaptive-grid/

http://webdesignledger.com/resources/responsive-web-design-templates-and-frameworks

发电机