1.浮動元素有什么特征?對父容器、其他浮動元素、普通元素、文字分別有什么影響?
特征:脫離標準流,行內(nèi)元素將可以設(shè)置寬高,塊級元素并排顯示
對父容器、其他浮動元素、普通元素、文字分別有什么影響?
父容器:會使父容器高度為0
其他浮動元素:
同方向:當一個浮動元素在浮動過程中碰到同一個方向的浮動元素時,它會緊跟在它們后面
反方向:互不影響,位于同一條水平線上,當空間不夠時會被擠下
普通元素:浮動的元素脫離標準流不占位置,所以下面的元素會占據(jù)浮動元素原來的位置并處于浮動元素的下層
文字:會發(fā)生字圍現(xiàn)象
2.清除浮動指什么?如何清除浮動?兩種以上方法
清除浮動的元素對布局造成的影響
方法:① 給父元素添加overflow:hidden;
②:添加一個clearfix的類,.clearfix:after
3.有幾種定位方式?分別是如何實現(xiàn)定位的?參考點是什么,使用場景是什么?
常用的定位方式有4種
position:relative 相對定位,參考點是元素本身正常的位置
position:absolute絕對定位,參考點是除了static定位之外的第一個祖先元素
position:static 靜態(tài)定位
position:fixed 固定定位,參考點是瀏覽器窗口
應(yīng)用場景:
固定定位:登錄頁面的遮罩層
絕對定位和固定定位:輪播圖點擊按鈕切換圖片
4.position:relative和負margin都可以使元素位置發(fā)生偏移,二者區(qū)別是什么?
position:relative移動位置后還占據(jù)原來的位置