完美的液体布局

时间:2009-07-22 10:26:31

标签: html

你能否告诉我一个网站(最好是一个论坛),它有完美的流畅布局(如果浏览器窗口调整大小,根本不会破坏)?很高兴看到......

再一次,在网络上我可以看到一个网站在挤压时不会变得一团糟,并且在放大时不会限制自己的宽度?

你有没有关心过这个?或者你关心多少?因为我看到流行的网站(甚至是门户网站,我不打算任何名字)都有这个问题(我认为是这样)。

好吧,我想知道你的代码是左边的头像和右边的一些用户信息。请看这张图片找出我的意思:savepic.ru/780576.png

3 个答案:

答案 0 :(得分:2)

在许多地方破坏它的主要原因是它在基础层面上被打破:CSS并不真正支持流畅的布局,即使你开始使用表格进行布局,仍然存在极端情况。最重要的是,每个浏览器和每个浏览器的每个版本都会使CSS略有不同。

最终的结果是,即使是高薪的网页设计师也无法做到正确(或者有人会提出解决方案,现在每个人都会使用它。)

唯一的希望是浏览器开发人员最终同意使他们的产品符合Acid3 test。但是当我写这篇文章时,我的Firefox 3.5.1只有92%。 WebKit(Safari和Google Chrome)和Opera完全100%(见this article)。

我个人已经放弃了这一点,我不会重新审视这个话题,直到IE 7降至popular usage charts的5%以下,这可能需要5到10年(IE 6已经作为日志死了但仍然获得12%)。

答案 1 :(得分:1)

Smashing Magazine有关于流畅布局的几篇帖子。尝试在那里寻找好的例子和解释。

我最喜欢的一个例子是Vivabit

就个人而言,我还没有关注它,但随着上网本和移动浏览器的兴起,我可能应该这样做。我仍然认为你应该为移动浏览器提供不同的布局,但是看看为所有浏览器提供相同服务的可能性很有意思。

答案 2 :(得分:0)

好吧,Slashdot有一个完全流畅的中间列(最小到一些非常小),左右两侧有固定宽度的列。据我所知,它没有限制其宽度(在我的1900x1200显示器上测试)。

这不是主页上的论坛,但对文章的评论有点像。它没有您正在寻找的头像示例:(