父级div高度100%,里面有三个子div,上中下排列,三个子div高度都是自适应的,且顺序不固定,求大神指点
<div style="border: 1px solid #ccc;width:100%;float:left;height:30px;s"></div>
<div style="border: 1px solid #bbb;width:100%;float:left;height:30px;"></div>
<div style="border: 1px solid #aaa;width:100%;float:left;height:30px;"></div>
欢迎收藏素文宅博客:blog.yoodb.com
你是说父级怎么自适应吗?要是父级的话添加个类father可以用添加个伪类:after
然后设置.father:after{content:''; display:block; clear:both;}
子div的样式给width:100%;height:33%;
<div style="height:100%;">
<div style="width:100%;height:33%;border:1px solid red;">s</div>
<div style="width:100%;height:33%;border:1px solid red;">s</div>
<div style="width:100%;height:33%;border:1px solid red;">s</div>
</div>
如果子div宽度都是100%的话,父div是会被三个子div高度撑开的,如果你子div都是用的float的话,建议给父div清除浮动~
你可以看看bootstrap里面的栅格系统,方便很多
设置 三个div float:left