最简单的(我希望)在这里查看:http://jsfiddle.net/UG7un/
有一个固定的包装器,它以 20 像素的边距覆盖整个页面。如何让内容在该包装器内滚动?
<div id="wrap">
<div id="content">
<p>How can I get this to scroll within this white content area only, using the native browser scroll?</p>
</div>
<div id="photo"></div>
</div>
html {
background:url(http://i1210.photobucket.com/albums/cc406/Ingutuks/2012/P5211369.jpg) no-repeat center center fixed;
background-size:cover;
}
#wrap {
background:#fff;
margin:20px;
position:fixed;
overflow:hidden;
}
#content {
width:45%;
padding:2.5%;
float:left;
}
#photo {
width:50%;
background:url(http://i1351.photobucket.com/albums/p790/KrazyKobraRawr/Jojothecat_zps448af247.jpg) no-repeat center center;
background-size:cover;
float:right;
}
最佳答案
如果我理解正确,那么您可以在 wrap
div 中使用 overflow:auto;
。
#wrap {
background:#fff;
margin:20px;
position:fixed;
overflow:auto;
}
它将在您的 wrap
div 中显示滚动条。
关于html - 如何使用 native 浏览器滚动在固定包装器中滚动内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16347135/