当分辨率太小时，防止html元素变形

Question

当你缩小网络浏览器的宽度时，我会看到像亚马逊和谷歌这样的网站元素只会挤压到某一点，然后即使你缩小宽度也会停止压缩。

哪种技术可以实现这一目标？是否有可以启用此功能的特定CSS属性？

Answer 1

您可能会看到min-width和min-height样式。

例如：

.myclass {
    width: 50%;
    min-width:100px;
}

...将占据容器对象的50％，因此可以调整大小，但永远不会小于100px宽。

min-height的工作原理大致相同。

请注意，如果您需要支持IE6，则此浏览器不支持min-height或min-width。 （有解决办法，但最好的解决办法是不支持IE6）

Answer 2

CSS min_width属性。

Answer 3

#header {
  background: url(../images/image.jpg) repeat-x;
  min-width: 960px;
}

希望这有帮助

Answer 4

他们使用min-width和min-height css属性。

例如，要使内容div（或HTML 5内容标记）在300px宽时停止缩小，请使用以下css代码：

div#content {
    min-width: 300px;
}

您仍然可以将此方法与百分比或基于em的布局一起使用 - 只需使用它来防止页面变小：

div#content {
    width: 70%;
    min-width: 300px;
}

注意：min-width属性在计算何时启动时不包括填充，边框或边距（它只考虑容器的宽度）。