如何使网站适应用户的屏幕分辨率?

时间:2011-01-24 05:59:41

标签: javascript css webpage resolution

我正在使用1024x768屏幕分辨率的基础设计我的网站。当您从具有较小/较大屏幕分辨率的计算机查看浏览器中的网站时,网站开始变形 无论用户使用什么屏幕分辨率,我如何使网站适应用户的屏幕分辨率?我相信它可能通过JavaScript或CSS,但不确定如何......

2 个答案:

答案 0 :(得分:4)

解决此问题的最佳方法是使用 px 使用 em 或%(百分比)。

.container {
  width: 1000 px;
  height: 750 px;
}

.container {
  width: 90%;
  height: 90%'
}

答案 1 :(得分:0)

您正在寻找的是浏览器“视口”。

此链接提供了如何获取视口的完整概述:http://andylangton.co.uk/articles/javascript/get-viewport-size-javascript/

在大多数标准浏览器中,您只需在JavaScript中引用window.innerWidth和window.innerHeight即可。

如果你正在使用dojo JavaScript框架,那么你可以调用dijit.getViewport()来为你做繁重的工作。

获得视口的尺寸后,您可以自行决定网页对从浏览器接收的信息的反应。