用js写了个计算器为什么在写页面时需要在最后加个
<div style="clear:both"></div>啊?
不加的话 计算器的左右下边框就没了!
<div style="clear:both"></div>这个应该怎么用啊?
什么情况需要加这个啊?
<style type="text/css">
为方便观看 之列出了含float的样式
.panel p, .panel input {
font-family: "微软雅黑";
font-size: 20px;
margin: 4px;
float: left;
border-radius: 4px;
}
.panel p {
width: 122px;
height: 26px;
border: 1px solid #ddd;
padding: 6px;
overflow: hidden;
}
</style>
<body>
<div class="panel" onclick="cal(event);">
<div>
<p id="screen"></p>
<input type="button" value="C">
<div style="clear:both"></div>
</div>
<div>
<input type="button" value="7">
<input type="button" value="8">
<input type="button" value="9">
<input type="button" value="/">
<input type="button" value="4">
<input type="button" value="5">
<input type="button" value="6">
<input type="button" value="*">
<input type="button" value="1">
<input type="button" value="2">
<input type="button" value="3">
<input type="button" value="-">
<input type="button" value="0">
<input type="button" value=".">
<input type="button" value="=">
<input type="button" value="+">
<div style="clear:both"></div>
</div>
</div>
</body>
应该是清除float
去w3C上看看clear:both的用法及各种显示效果。
你不清楚浮动后续元素也会浮动,并且父容器会出现不占位的情况。
就是清除浮动的,但是不建议这样做,因为添加了一些冗余的代码;如果不清楚---为什么清除浮动,可以参考http://blog.csdn.net/qq_19558705/article/details/49841059
因为字体的问题,可能不好找到,用ctrl + f;查询清除浮动就可以。