网页设计:如何处理窗口大小调整?

时间:2011-09-08 14:24:34

标签: html css layout window webpage

有人可以告诉我处理不同窗口大小的最佳方法,以及用户在创建网页时调整窗口大小。

因为我总是发现自己用html,css等创建布局,起初一切看起来都很完美。但是,只要我增加或减少浏览器窗口的大小,一切都会崩溃。

如果有人能指出某种指南或任何相似的东西,也会很棒。

谢谢它提前!非常感谢任何帮助!

1 个答案:

答案 0 :(得分:2)

对于检测,您可能希望使用css媒体查询(在这种情况下,您可能希望对旧版浏览器使用https://github.com/scottjehl/Respond Respond.js的垫片,添加更全面的跨浏览器支持),并定位某些屏幕宽度。 http://html5boilerplate.com并且它是默认的css:http://html5boilerplate.com/css/style.css为这种类型的媒体查询设置了一个很棒的默认css。

另一种方法是为页面的外部容器提供固定的最小和最大宽度。例如:

body{text-align:center;} 
#outer-container{text-align:left;margin:0 auto 0; width:98%;max-width:900px;min-width:760px;}

通过这种方式,你可以增长和缩小它,看看它在一定范围内的外观,并知道其他观察窗口会看到加上水平滚动条,最糟糕的是小视角。

一般来说,只使用html5boilerplate作为起始基础是一种很好的方法,它是一项很出色的工作。