over-float清除浮动
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 .box{ 8 border: 1px solid red; 9 overflow: hidden;<!--
相当于子太大父亲包不住,overflow:scroll是滚动条--> } 11 .item{ 12 width: 200px; 13 height: 200px; 14 background-color: black; 15 float: left; 16 } 17 </style> 18 <!-- 19 清除浮动的方法 20 1、加高度 (扩展性不好) 21 2、给父级加浮动 (页面中所有元素都加浮动,margin左右自动失效(floats bad !)) 22 3、.inline-block 清浮动方法 (margin左右auto失效) 23 4、空标签清除浮动 (IE6 最小高度 19px;(解决后IE6下还有2px偏差)) 24 5、.br清浮动 (不符合工作中:结构、样式、行为,三者分离的要求) 25 26 --> 27 </head> 28 <body> 29 <div class="box"> 30 <div class="item"></div> 31 </div> 32 </body> 33 </html>
【推荐】还在用 ECharts 开发大屏?试试这款永久免费的开源 BI 工具!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步