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