1.浮動原理：浮動在當前行，脫離原來文字，進入到新的一層（浮動層），然後在設定的方向（左右）移動，直到遇到父級盒子的邊緣，或者其他浮動塊的邊緣停止
2.浮動換行：當一行沒有足夠空間存放所有浮動塊時，多出來的盒子會擠到下一行，然後按照設定的方向繼續移動，直到遇到父級盒子的邊緣或其他浮動塊的邊緣
3.浮動坍塌：當父級盒子沒有設定具體高度，並且子級浮動的情況下，父級的高度會丟失，就是浮動的坍塌。（導致與父級盒子平級的文字會向浮動的盒子下方移動）
4清除浮動
父級固定高設定：不靈活
父級設定浮動：用來判斷是否要進行清浮動的處理
父級最後乙個子級位置新增block快，該快設定
clear:both;
父級選擇器::after
bfc:塊級格式化上下文
overflow:hidden;（超出部分隱藏）
::after 給盒子的最後乙個位置，新增乙個自定義的標籤
::before 給盒子的第乙個位置，新增乙個自定義標籤
5.浮動快特性：
1.所有的盒子都有可以浮動,並且在浮動脫離原文本流 後，將不在具有原有盒子的特性
2.支援所有的樣式設定
3.在不設定大小時，尺寸由內容撐開
4.四個方向的margin會疊加
5.水平布局方向不在固定
6.非浮動塊特性：
block：會向上佔據浮動塊所空出的區域，可以被浮動塊遮蓋
inline,inline-block，文字
無法出現在浮動塊所覆蓋的漁區，一般形成環繞效果
7.浮動換行阻擋
一般情況下出現在瀑布流布局當中 如果上一行的浮動塊高度不一致，就會導致當前行浮動塊在浮動過程中被阻擋，margin也是浮動塊停止的邊緣。
一般情況下高度不一致，往往是由盒子的內容高度不一致，問題最多就是，當每個的高度比不一致時，設定相同的高度，高度會有差異，
解決辦法：
設定object-fit:cover;
pc端：
1.差異不大
給所有的給相同的固定高
2.高度差異很大
box作為可是區域，寬度大小固定。
在盒子中的大小設定要沾滿，甚至
超出box的可視區域。box本身設定overflow:hidden屬性
關於浮動和position的小知識點
浮動 假設在乙個div中我們有兩個span，要使他們上下居中左右貼著邊框，這其實是乙個很簡單的問題，我們要使乙個div居中直接margin 0 auto 但是在div中的span元素你卻不能使用這種方法，只能使用text align center，我覺得這個很奇怪，哪怕是把span設定成行內快也不可...
html定位屬性和浮動元素的知識點
static 靜態位置屬性 相對定位 relative 絕對定位 abosult 1 浮動後 元素本身脫離文件流，原來的位置被其他元素所佔據 2 浮動後 在同乙個父元素中，目標元素回佔據乙個浮動後位置。3 注意 浮動只能是 子元素在容器中進行位置移動。如果父容器剩餘寬度不能容納兩乙個子元素，那麼久換...
HTML和css中的知識點
1 你做的頁面在哪些流覽器測試過？這些瀏覽器的核心分別是什麼?ie trident核心 firefox gecko核心 safari webkit核心 opera 以前是presto核心，opera現已改用google chrome的blink核心 chrome blink 基於webkit，goo...