内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用
正在努力完成这个:
其中侧边栏将是固定的,但右侧(主要内容)将垂直滚动(如果用户的浏览器窗口较小,可能是水平滚动)。实现这一目标的最佳途径是什么?
使用Contentdiv作为页面的容器。
.sidebar { position: fixed; width: 200px; height: 400px; background: #000; } .content { margin-left: 200px; height: 500px; width: auto; position: relative; background: #f00; overflow: auto; z-index: 1; } .info { width: 1440px; height: 300px; position: relative; background: #f55; } <div class="sidebar"></div> <div class="content"> <div class="info"></div> </div>
http://jsfiddle.net/djw 28/jz52u/
例子:
@media (min-width:600px) { .sidebar { width: 250px; } .content { margin-left: 250px; } }