我想知道http://staffanstorp.se/如何具有流动内容的能力(我相信这个词,如果我错了,请纠正我)。我也会按照这样的方式更改标签,以便其他人可以在人们找到答案时找到这个帖子,因为我发现很难找到任何东西。
无论如何,我一直在网上搜索一个可能的jquery插件,它会为我做这个。上面的网站正是我需要的,我非常感谢你的帮助:D
我能找到的唯一的东西已经完成了这种类型的自动调整大小的内容,但只有文本,这个网站做了很多!
答案 0 :(得分:1)
使用media queries与liquid css layout结合使用。
否则安装firebug并开始分析代码 - 它就在现场。
答案 1 :(得分:1)
这是使用css文件中的媒体查询完成的。例如
@media screen and (max-width: 1024px){
img {
width: 400px;
height: 400px;
margin-left: -512px; }
}
@media screen and (max-width: 512px){
img {
width: 200px;
height: 200px;
margin-left: -512px; }
}
此css为所有图像提供规则,以便在屏幕宽度为1024px或更宽时将其大小限制为400px,并在屏幕宽度为512px或更宽时将其限制为200px。
通过创建适用于不同屏幕尺寸的单独规则,您可以提供这种动态布局。
第二种方式是不用固定术语定义任何东西。使用%widths等将允许您的页面适合任何大小,然后您可以使用上面的媒体查询在屏幕变得太小时移动内容。
希望这有帮助。