你的位置:首页 > 软件开发 > 网页设计 > html中子div用了浮动怎样让父div的大小自动撑开

html中子div用了浮动怎样让父div的大小自动撑开

发布时间:2016-01-17 17:00:04
浮动子div撑开父div的几种方法:(1)在父div中在添加一个清除浮动的子div<div ></div>,该div不设置任何样式,只用来清除浮动(2)在父div的css样式中设置overflow:hidden;zoom:1;(3)设置父div也为浮动元素 ...

浮动子div撑开父div的几种方法:

(1)在父div中在添加一个清除浮动的子div<div ></div>,该div不设置任何样式,只用来清除浮动

(2)在父div的css样式中设置overflow:hidden;zoom:1;

(3)设置父div也为浮动元素float:left;,这样设置的坏处是不能用margin:auto;实现居中

(4)设置父元素display:inline-block;,这样设置的坏处是不能用margin:auto;实现居中

(5)在父div中添加<br clear="all">子元素

小结:用哪一种方法根据自身情况来使用。

参考原文地址:http://www.jb51.net/css/173074.html

     http://www.jb51.net/article/43261.htm

 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>HTML5 Canvas画印章</title> 6 <style> 7   .divCss{ 8    position: relative; 9    width: 1024px;10    height: auto;11    border: 1px solid #999999;12    margin:auto;13    /*display:inline-block;*/14    /*float: left;*/15    /*overflow: hidden;16      zoom:1;*/17   }18   .style{19    position: relative;20    width: 300px;21    height: 400px;22    float: left;23    border: 1px solid #aaaaaa;24    margin:10px;  25   }26 </style>27 </head>  28 <body>29  <div class="divCss">30   <div class="style"></div>31   <div class="style"></div>32   <div class="style"></div>33   <div style=" clear:both;"></div> 34  </div>35 </body>36 </html>

原标题:html中子div用了浮动怎样让父div的大小自动撑开

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。