Question

我有一个在浏览器最大化时运行正常的登录页面。但是当我调整大小时，元素开始四处游荡。我做了一些研究，我发现了这个：

#wrapper { /*It will contain all the elements.*/
   margin-left: auto;
   margin-right: auto;
   min-height: 500px;
   min-width: 500px;
}

它可以工作，但由于我设置的是最小高度和最小宽度，因此某些屏幕分辨率将强制浏览器应用滚动条，即使它已最大化。有没有办法只在用户调整浏览器大小时显示滚动条？

Answer 1

为什么不将min-height设置为400px？

这将允许所有分辨率显示没有滚动条的页面

（最小分辨率：640x460） - ＆gt; 640 px宽度和460 px高度。

总的来说，你不能强迫浏览器不显示滚动条，同时保持滚动功能（至少没有一些框架）

Answer 2

您可以更改溢出设置以隐藏和显示滚动条。更多信息：http://www.w3schools.com/cssref/pr_pos_overflow.asp无法检测到用户仅使用HTML / CSS调整了浏览器的大小。你可以用javascript做到，但你可能不想用javascript编写你的页面样式。但是，您可以使用媒体查询以不同的文档宽度应用不同的css规则。更多信息：http://www.w3.org/TR/css3-mediaqueries/

Answer 3

如果您的内容允许，您可以让事情变得更加灵活，如下所示：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">

<style media="all">
div {background: red; width: 40em; padding: 1em; margin: 0 auto; max-width: 100%;}
</style>

</head>
<body>

<div>
    <p>content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content</p>
</div>

</body>
</html>

浏览器最大化时应用CSS？

3 个答案: