有没有人知道如何根据浏览器宽度完成不同的布局，比如这两个网站？
我尝试过谷歌，查看Stackoverflow问题，看看他们的代码，但我想我错过了一些东西。它实际上根据窗口的宽度重新排列和调整一些元素的大小，但是如何？的Javascript？
很抱歉，如果我的搜索技能只是失败，但我不确定要查找什么，这里的“类似问题”似乎并不相关，甚至CSS-Tricks也没有简单的信息寻找地方。
答案 0 :(得分：5)
您无需使用JS来检测浏览器宽度。您可以简单地使用CSS媒体查询来更改布局。
例如：
@media screen and (max-width: 1280px) {
... selector(s) here ...
}
仅将CSS应用于最多1280像素宽的屏幕。
另见：
答案 1 :(得分：1)
您可以使用CSS3媒体查询根据屏幕宽度提供不同的样式。有关详细信息，请参阅此处：http://www.css3.info/preview/media-queries/
例如，如果您查看sasquatchfestival.com网站的CSS源代码，您可以看到他们正在做的事情：http://sasquatchfestival.com/css/screen.css?v=1328828795。搜索“@media only screen”，你会看到他们为宽度低于768px，768-1024px和1024px以上提供不同的CSS。
答案 2 :(得分：1)
您可以使用众多可用的响应式框架之一重新发明轮子或仅构建/重建您的网站。我使用了'Skeleton'和'Bootstrap by Twitter'他们的框架可以在...发现 骷髅... [http://www.getskeleton.com/][1] Bootstrap ... [http://twitter.github.com/bootstrap/] [2]
我使用每个网站构建网站... 骷髅... [http://72t.net] [3] Bootstrap ... [http://ReactiveWebDesign.net] [4]
我仍然在尝试决定我更喜欢哪种，但是现在靴带似乎提供了更多的功能。
答案 3 :(得分：0)
在那里可能有点jMasonry，但它看起来有点像Twitter Bootstrap在rails中提供的内容，可能值得倾听静态CSS版本的答案。