DIV+CSS网页布局中清除浮动的研究  

Research on the floating clearing in DIV + CSS web layout

作　　者：罗才华[1] Luo Caihua(Department of Electronic Information,Luoding Polytechnic,Luoding,Guangdong 527200,China)

机构地区：[1]罗定职业技术学院电子信息系,广东罗定527200

出　　处：《计算机时代》2018年第10期64-67,共4页Computer Era

基　　金：广东职业教育信息化研究会科研规划项目2016-2017年度课题(YZJY161720);2016年度广东省高等职业教育研究会课题(GDGZ16Y079);罗定职业技术学院2016年度科研项目(KY2016029)

摘　　要：浮动是CSS的基本定位机制之一,在网页布局中应用非常广泛。本文对浮动引起的父元素高度坍塌现象进行了分析,并提出了clear属性和触发新的BFC两种清除浮动的方法。实验结果表明,在众多触发新的BFC条件中,.clearfix清除浮动的方式在不破坏文档结构的同时,也没有增加太多的代码,在解决浏览器兼容性问题方面也表现突出。Float is one of the basic positioning mechanisms of CSS and is widely used in web layout. This paper analyzes the phenomenon of parent element height collapse caused by floating, and proposes two methods to clear floating, which are clear attribute and triggering new BFC. The experimental results show that in many new BFC trigger conditions, the .clearfix does not destroy the structure of the document, and also does not add too much code, so it also does well in solving the problem of browser compatibility.

关 键 词：浮动 坍塌 触发 BFC 清除浮动 

分 类 号：TP312[自动化与计算机技术—计算机软件与理论]