网站解决方案在不同的电脑中出现问题

Question

我设计了一个网站。当我在具有不同分辨率的不同PC中打开最终网站时，我的网页与我设计的不一样。内容不在身体位置。

有人可以解释原因吗？ 还有什么解决方案吗？

Answer 1

这是许多开发人员面临的问题。

问题在于，如果你使用px控制所有div的位置，我的屏幕（如果你调整窗口大小，甚至你的屏幕都会使页面看起来不同）。

我建议您稍微了解一下CSS及其使用方法（包括使用像素以外的单位）。

了解何时使用auto，%，px以及您需要了解的其他内容以使您的网站在尽可能多的设备上看起来相同是很方便的。

W3有一个很好的Responsive Web Design - Introduction，您可能想要查看。

最终它会教你什么是响应式设计：

  

当您使用CSS和HTML调整大小，隐藏，缩小，放大或移动内容以使其在任何屏幕上看起来都很好时，它被称为响应式网页设计。

介绍涵盖的主题包括：

• 简介

• 视口

• 网格视图

• 媒体查询

• 图片

• 画

• 框架

祝你好运！希望你的项目顺利进行！

Answer 2

使用px单位，以便它不会更改图片的大小，并将以下代码添加到head标记前的body标记中：

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