标签：高度 表示 doc 介绍 border 嵌套 -- body har
下面简单介绍float的用法，表示含义在注释行
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <div style="background-color: red;width: 20%;float: left">123</div> <!--正常div是块及标签，float以后后面的标 9 签就能和此div放在同一行，float的value里面left是指此标签挨着上一个float的标签末尾靠左放--> 10 <div style="background-color: black;width: 50%;float: left;border: 3px solid yellow">123 11 <div style="color: red;width: 20%;float: left;height: 30px;border: 3px solid green">我就是float左边</div> 12 <!--div嵌套里面的宽度是相对于父标签的宽度为基准--> 13 <div style="color: red;width: 20%;float: right;height: 300px;border: 3px solid green">我就是float右边</div> 14 <!--父标签没有高度时候子标签会将父标签撑高，父标签的高度取子标签最高的一个--> 15 16 </div> 17 <div style="background-color: blue;width: 200px;border: 3px solid green;color: yellow">123 18 <div style="color: red;width: 20%;float: left;height: 30px;border: 3px solid green">我就是float左边</div> 19 <div style="color: red;width: 20%;float: right;height: 30px;border: 3px solid green">我就是float右边</div> 20 <div style="clear: both"></div> <!--子标签float以后让父标签的表框处于子标签边框上一层--> 21 </div> 22 23 <div style="background-color: green;width: 50%;float: left">123</div> 24 </body> 25 </html>
标签：高度 表示 doc 介绍 border 嵌套 -- body har
原文地址：https://www.cnblogs.com/flags-blog/p/10392336.html
