每天10道題,100天后,搞定所有前端面試的高頻知識(shí)點(diǎn),加油!??!,在看文章的同時(shí),希望不要直接看答案,先思考一下自己會(huì)不會(huì),如果會(huì),自己的答案是什么?想過之后再與答案比對(duì),是不是會(huì)更好一點(diǎn),當(dāng)然如果你有比我更好的答案,歡迎評(píng)論區(qū)留言,一起探討技術(shù)之美。
面試官:清除浮動(dòng)有哪些方式?
我:呃~,浮動(dòng)元素會(huì)脫離文檔流(絕對(duì)定位元素也會(huì)脫離文檔流),導(dǎo)致無法計(jì)算準(zhǔn)確的高度,這種問題稱為:“高度塌陷”。
清除浮動(dòng)常見的有以下三種方式,整出代碼如下:
觸發(fā)BFC:(有缺陷,會(huì)造成內(nèi)容的溢出隱藏)
<style> *{margin: 0;padding: 0;} ul { list-style: none; border: 10px solid #ccc; overflow: hidden; /*觸發(fā)BFC清除浮動(dòng)*/ } ul li { width: 100px; height: 100px; background-color: #f00; float: left; } </style> <body> <ul> <li>1</li> <li>2</li> <li>3</li> </ul> </body>
登錄后復(fù)制
多創(chuàng)建一個(gè)盒子,并添加樣式:clear:both; :(不推薦使用,此方法已經(jīng)過時(shí))【