言归正传,div+css作为网页的布局已经是大势所趋。它的优点不在这里啰嗦。但最近经常有 朋友 提到关于容器高度自适应的兼容性问题。在这里 简单 作答。
1.有些时候,我们希望容器有一个固定高度,但当其中的内容多的时候,又希望高度能够自适应,也即容器在纵向能被撑开,且如果有背景,也能够自适应。在一般情况下,使 用M in-h ei ght即可解决。但是广大 网民 的首选浏览器ie6并不支持min-height。ie7, opera ,火狐没有问题。所以采用以下写法可以解决兼容性:
复制代码
代码如下:
height:auto!important;
height:200px;
min-height:200px;
2.很多朋友反映用上面的方法后,在有些时候依然无法解决容器无法撑开自适应的问题。那一定是有容器嵌套的情况下,而子容器又是浮动的。例如
<div class="fuqin"><ul><li>内容1</li><li>内容1</li></ul></div>
其中class为fuqin的div有浮动的li,当li比较多的时候,即便是div设置的是最小高度,也无法被撑开。
原因 就在于作为子容器的li是浮动的即 。在这种情况下,即便是li的内容超过了div的高度,div也无法撑开。
解决方法如下:
在浮动的容器后面,父容器结束之前加入一个div
复制代码
代码如下:
<div class="fuqin"><ul><li>内容1</li><li>内容1</li& am p; gt;</ul><div class="clearfloat"></div></div>
.clearfloat{clear:both;height:0;font- Size: 1px;line-height: 0px;}
总结
以上是 为你收集整理的 里面的div怎么撑开外面的div让高度自适应 全部内容,希望文章能够帮你解决 里面的div怎么撑开外面的div让高度自适应 所遇到的问题。
如果觉得 网站内容还不错, 推荐好友。
查看更多关于里面的div怎么撑开外面的div让高度自适应的详细内容...
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://www.haodehen.cn/did204849