Question

http://www.juliabailey.com/

这个网站设计流畅，工作得非常好。

这是我的网站。流体视图取决于宽度。因此，当我得到我的浏览器更大的宽度变得更大和高度。但问题是高度太大而且创建了我不想要的滚动条。我没有在我的页面上显示什么滚动条。我认为最好的方法是取决于高度的流畅视图，因此无论您的浏览器是800x600还是1600x1200，它总是适合浏览器。我该怎么办？

这是我的包装代码;

#wrapper {
    width:auto;
    height:auto;
    width:80%;
    min-width:550px;
    max-width:1150px;
    margin:50px auto 0 auto;
    z-index:100;
    }

Answer 1

使用百分比作为类的属性。例如：

wrapper {
width: 92%;
}
content {
width: 73%;
}
sidebar {
width: 25%
}

输入物品OR

您还可以使用javascript来检测您需要的内容，然后动态更改实现。有点像这样

    function dynamicLayout(){ var browserWidth = getBrowserWidth();  
    // Narrow CSS rules 
if (browserWidth < 640){ changeLayout("narrow"); } 
    // Normal (default) CSS rules 
if ((browserWidth >= 640) && (browserWidth <= 960)){ changeLayout("default"); } 

    // Wide CSS rules 
if (browserWidth > 960){ changeLayout("wide"); } }

在你的例子中，你有一个min width属性，这意味着如果它小于你将有滚动条。如果你不想要滚动条，你不能为任何布局元素设置任何静态值，所以它可能会弯曲到浏览器窗口大小。

Answer 2

使用min-height和max-height，以便浏览器在到达时停止缩放。样本的滚动条始终可见，即使它是“空”，这也就是调整大小时它不会跳转的原因。

宽度和宽度高度流体设计

2 个答案: