如题,求三种解法,希望各位大神能详细说明下。
如果外层div高度自适应于内部,就完全不需要额外写规则了,另外一个DIV绝对能撑高外层div,填得紧紧实实的。
如果是外层div自适应于它的父级,纯CSS的办法是有的。
为了方便演示,下面的demo都让外层元素100%适应于html和body,点Edit in JSFiddle之后可以看到,拖动窗口高度,均能自适应。
box-sizing: border-box;
同时设置padding: 100px 0 0
;height: 100%;
这就是两个方案了:
http://jsfiddle.net/xq4rew3f/1/
http://jsfiddle.net/xq4rew3f/3/
position: relative
;position: absolute; top: 100px; bottom: 0; left: 0
第三个方案:
http://jsfiddle.net/xq4rew3f/5/
注意一下,这三个方案都是IE8+。
8 回答5.8k 阅读✓ 已解决
9 回答9.2k 阅读
6 回答4.8k 阅读✓ 已解决
5 回答3.5k 阅读✓ 已解决
5 回答8k 阅读✓ 已解决
2 回答6.8k 阅读
4 回答7.9k 阅读✓ 已解决
三、flex
http://jsfiddle.net/uqevaprx/
四、pisition
http://jsfiddle.net/uqevaprx/1/