讓裏面的div撐開外面的div,讓高度自適應
阿新 • • 發佈:2018-11-24
css var 浮動 count lis head style oat height <div class="choose-box" style="float:left;">
<div class="choose-box-item" id="${list.dictionaryId }" name="focusArea"> ${list.dictionaryName}</div>
</div>
</c:forEach>
<div class="clearfloat"></div>
</div> <div class="fuqin">
<ul>
<li>內容1</li>
<li>內容1</>
</ul>
<div class="clearfloat"></div>
</div>
.clearfloat{clear:both;height:0;font-size: 1px;line-height: 0px;}
<!-- 設置clearfloat樣式,讓裏面的div撐開外面的div,讓高度自適應 -->
<style type="text/css">
.clearfloat{clear:both;height:0;font-size: 1px;line-height: 0px;}
</style>
</head>
<div class="choose-bg-box">
<c:forEach items="${focusAreasList }" var="list" varStatus="count">
<div class="choose-box-item" id="${list.dictionaryId }" name="focusArea"> ${list.dictionaryName}</div>
</div>
</c:forEach>
<div class="clearfloat"></div>
</div>
在浮動的容器後面,父容器結束之前加入一個div,代碼如下:
<ul>
<li>內容1</li>
<li>內容1</>
</ul>
<div class="clearfloat"></div>
</div>
.clearfloat{clear:both;height:0;font-size: 1px;line-height: 0px;}
讓裏面的div撐開外面的div,讓高度自適應