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

Question

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

Answer 1

解决此问题的最佳方法是使用 px 使用 em 或％（百分比）。

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

---

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

Answer 2

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

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

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

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

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