CSS流体布局缩放内容

Question

我有一个CSS问题，你可以帮忙。

我正在尝试建立一个“流体”布局的网站。

所有网站内容都将包含在包装器div中

当屏幕出现故障时，我希望包装器div与它的内容一起推卸。

但是，当屏幕尺寸增加时，我希望包装div保持最大尺寸。目的是防止图像缩放超出其原始分辨率和文本格式的变化（段落可能在非常大的屏幕上变成一行）

我可以将最大像素和百分比应用于包装DIV吗？是否有更好的方法来实现目标？

.wrapper {
    margin: 0 auto; 
    max-width: 800px;
    width: 80%;
    background-color: #ffffff;
    border: 1px solid;
    height: 1000px;
    }

非常感谢， P

Answer 1

是的，你可以这样做，这是一个很好的做法。

Answer 2

  

我可以将最大像素和百分比应用于包装器DIV吗？

是，您可以申请

.wrapper {
    margin: 0 auto; 
    max-width: 800px;
    width: 80%;
    background-color: #ffffff;
    border: 1px solid;
    height: 1000px;
    }

width: 80%;表示屏幕宽度（或浏览器窗口）的80%，且不会超过max-width: 800px;

  

CSS中的max-width属性用于设置a的最大宽度   指定的元素。 max-width属性会覆盖宽度   属性，但是min-width将始终覆盖max-width是否   在声明中宽度之前或之后。