Heim >Web-Frontend >HTML-Tutorial >html中子div用了浮动怎样让父div的大小自动撑开_html/css_WEB-ITnose
html中子div用了浮动怎样让父div的大小自动撑开_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:29:161230Durchsuche
浮动子div撑开父div的几种方法：
（1）在父div中在添加一个清除浮动的子div，该div不设置任何样式，只用来清除浮动
（2）在父div的css样式中设置overflow：hidden;zoom:1;
（3）设置父div也为浮动元素float：left；，这样设置的坏处是不能用margin：auto；实现居中
（4）设置父元素display:inline-block;，这样设置的坏处是不能用margin：auto；实现居中
（5）在父div中添加
子元素
小结：用哪一种方法根据自身情况来使用。
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>
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：无后缀url如何实现？_html/css_WEB-ITnoseNächster Artikel：Chrome浏览器加载CSS文件TTFB waiting超时的奇葩问题_html/css_WEB-ITnose