将我的网站改编为不同的资源

Question

我一直在这个网站上工作，它几乎结束......直到我发现我的电脑处于高分辨率（1920 x 1080px）。 我在1024x768px上测试了我的网站，它不是我所期望的。

无论如何，我在网上搜索得很远，还有一些我没有找到答案的问题，所以我在这里问你，希望找到答案！

首先，我想要的关于我的网站，是对于计算机上的任何屏幕分辨率，从1024到1920。 另外，当你缩小窗口时，我希望它很舒服（你知道，就像当你制作的网页只覆盖屏幕的一半时）。

（英语不是我的母语，所以我希望你们这些人仍然可以理解......）

1-我开始使用 px 。这不适用于较低的分辨率，用户必须取消缩放。所以现在我正在网上建议使用％。但是现在当我缩小我的屏幕左侧的窗口时，它也适应了，但是太多了......我希望它在你减少窗口时显示水平滚动条。 所以基本上这是我的问题，我应该怎么做？我发现很多网站都运行正常（就像这一个，如果你减少窗口出现水平滚动条！） 也许结合px和％？我不知道，我真的不知道该怎么做。

2-屏幕上的屏幕分辨率与大小相似？例如，我的分辨率是：1920x1080px 如果我将窗口放在屏幕的左半边，相当于1920x5040像素的分辨率？

3-对于手机和平板电脑，这只是一个较小分辨率的问题吗？或者还有什么？

非常感谢你帮我解决这个问题！ 干杯， 比尔

Answer 1

1. 首先，您需要拥有所有元素的容器。每个百分比值都基于它的容器。对于滚动条，您的网站容器中可能包含CSS overflow: auto，因此您需要删除它或将其更改为min-width
2. 我认为你的意思是内容会水平收缩并垂直扩展。这是因为您没有任何容器来包装具有百分比宽度的每个元素。所以你需要拥有它并设置该容器的a。
3. 对于触控设备，您的网站会根据容器的大小缩小。

Answer 2

这不是一个简单的问题。你想要做的是停止考虑像素。阅读响应式设计。了解HTML的弹性特性及其重排文档的能力。阅读媒体查询。

基本上，从起点开始， DO NOT 为任何事物指定显式宽度，除非有必要。无论分辨率如何，s和

都会自动拉伸到全屏宽度。

你害怕，你有很多学习曲线。祝你好运，阅读很多。