jquery - 如何使我的网站可扩展？

Question

我正在用 HTML 和 CSS 创建一个网站。我希望它看起来相同(即具有相同的比例和大小)，无论显示器的分辨率是多少或窗口的大小如何。我可以通过提供我的 <div> 来做到这一点元素 width:100%;但这使得当窗口被拉伸(stretch)时，<div> 的内容也会拉伸(stretch)或收缩。我可以通过提供特定的像素值来做到这一点，但这会使它在具有不同分辨率的屏幕上太大或太小 - 我已经通过更改我的计算机上的分辨率和测试来测试它。我该怎么做才能让它在所有浏览器的所有显示器上看起来都一样？

Answer 1

分辨率，是图像的质量。我个人不知道如何改变质量。但是我知道如何使图像适合您使用的任何屏幕，这就是我认为的问题所在。

如果说你正在编程并且你的屏幕看起来像这样

但是你需要弄清楚这在移动设备上是什么样子的？

所以你按下 ctrl + shift + i(仅适用于 chrome 和 chromium)，你会得到一个如下所示的屏幕:

[

现在您可以编辑网站，使其看起来像您想要的那样。在中间的左侧，您可以单击它并查看您的应用在针对不同的手机和平板电脑调整大小时的外观。并假设您希望在特定尺寸的屏幕上使用它，您可以编辑像素并进行自定义。

但是让我们说，当你按下 ctrl + shift + i 时，你会得到像这样的不成比例的东西

那么你的问题就是少了一行代码。要解决这个问题，您需要的是:

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