Question

我有一个困扰我很长很长时间的问题如何在调整浏览器大小时保持网站的默认页面大小。

我们只是说页面大小是1280x720，我在调整浏览器大小时如何保持这个大小呢？例＆gt; google.com

这意味着页面DIV元素不会搞砸..
现在，浏览器调整大小时，我的网站截图...

你可以在右上角看到DIV的一些问题现在我希望它实际上是这样的：
注意下面的图片是照片显示示例。

谁知道怎么做，我真的很感激如果没有JavaScript可能会比它更好:-)

感谢。

Answer 1

所以你想要做的就是建立一个响应迅速的网站，反应迟钝。

由于您尚未生成特定于您的特定网站的任何代码，因此这里有一些指导原则 -

如果您只想禁用自动换行，则可以使用white-space: nowrap。

请注意，可能还有其他特定于您网站的更改，但这些更改可以帮助您入门。希望有所帮助！

Answer 2

如何在调整浏览器大小时保留网站的默认页面大小？

通过这种方式，我认为你的意思是让网站在所有可能的大小调整中看起来都一样。不幸的是，你不能。这将是您的内容触及页面边缘的一个点。那么会发生什么？你想让它水平滚动吗？这是默认行为。您可能更喜欢以某种方式在页面上移动内容，以便它永远不必水平滚动。最好的方法是使用media queries。

使用媒体查询，您可以修改调整大小时页面的显示方式：

@media (max-width: 600px) {
  .sample {
    font-size: 20px;
  }
}

您可以使用媒体查询改变网站的任何方面，并且可以为每个宽度设置不同的设计。您甚至可以使用媒体查询根据移动设备的方向调整网站的外观，orientation，例如：

@media (min-width: 700px) and (orientation: landscape) { ... }

希望这有帮助！

Answer 3

使用CSS简单地为<body>标记指定固定宽度：

body{
    width: 800px;
    min-width: 800px; //make sure it doesn't shrink
}

Answer 4

您可以使用%但不能使用px，因为20px可以替换为7％或根据尺寸。

或者我们可以使用媒体查询

@media screen and (min-width: 480px) {
    body {
        //styling
    }
}