我想实现这样的布局:
-----------------------------------------------------------
| |
| fixed height |
| |
|----------------------------------------------------------|
| | s |
| takes all the rest available screen height | c |
| fluid height, not fixed, | r |
| dependent on the screen height | o |
| | l |
| | l |
| | b |
| | a |
| | r |
------------------------------------------------------------
使用css和html,不使用javascript,可以吗?滚动条应该从上到下完全可见。
See: http://jsfiddle.net/s7FH6/show/ (edit)
HTML:
<div id="header"></div>
<div id="content"></div>
CSS:
html, body {
margin: 0;
padding: 0;
overflow: hidden
}
#header {
background: #ccc;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 150px
}
#content {
background: #eee;
position: absolute;
left: 0;
top: 150px;
bottom: 0;
width: 100%;
overflow-y: scroll
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)