2

我以http://reddit.com的网站为参考构建了一个 css 网页，其中侧栏在页面上始终保持相同大小，而整个左侧在屏幕上逐渐缩小。

sidebar{width:400px;float:right;/*rest doesn't matter*/}
leftside{width:auto;height:auto;;overflow:hidden;/* no float */} // i think this
// is where i missed up, reddit's site didn't have this

无论如何，这个网站在移动设备上根本无法扩展，侧边栏占据了整个屏幕，但在 reddit 的网站上它可以很好地扩展。如何使我的网站规模化？我需要另一个 div 来包裹侧面和左侧吗？我试着在网上查了一下，但是大家都说不要用px来定义侧边栏，但是reddit用了px，而且还是缩放...

谢谢

4

2 回答 2

3

如果在移动设备上，这可能是由于使用屏幕尺寸的媒体查询造成的，因为在我的浏览器上，reddit 的行为与您的描述相同，并且当我将其缩小到移动设备的大小时，侧栏会占用整个浏览器的大小设备。如果您不希望它像 reddit 在浏览器上的行为一样，您可以使用它；使用媒体查询以及浏览器的宽度，并在这些规则中调整侧边栏的大小，或者；使用某种 javascript 或 html5 和 css 将侧边栏设置为按钮，并在 OnClick 时将其扩展到整个屏幕

于 2012-09-24T00:17:00.003 回答
2

尝试使用响应式 css 框架，例如http://foundation.zurb.com/或http://gumbyframework.com/

于 2012-09-24T00:15:52.683 回答