浮動通常表現正常，但有時候搞起來會很糾結。特別是處理內部容器中的浮動，比如對一排使用浮動後對齊出現問題。inline-block是我們的另一種選擇。使用這種屬性可以模擬部分浮動的特徵，而不需要處理一些浮動帶來的問題。
inline-block 用在展示一系列**的需求，用inline-block代替了浮動。
inline-block : 同時兼有行內 ,,塊級 兩個 特徵。如下:
什麼時候使用inline-block，什麼時候使用float
什麼時候使用，取決於你的設計稿跟解決方法。文字環繞容器， 選擇浮動。 水平垂直居中對齊元素，選擇inline-block。
浮動、inline-block和影象排列
我使用inline-block主要是為了處理垂直對齊問題。
若父元素中的等高，設定浮動就會工作正常。但一旦有一列比較高時，的排列就會出現問題。這是因為浮動後，脫離了文件流。
而inline-block由於未脫離文件流，不會出現這個問題。如果你想再建立一列時，不會受到上一列inline:block的影響。而你在使用時需要時刻注意清除浮動，當內容不斷變化時, 使用浮動, 這很容易產生bug。
下面是 inline-block跟float的區別：
上面的塊級元素被設定了inline-block。由於他們沒有脫離文件流，所以元素不會被某個過長的列擠上來。
inline-block導航
另一種inline-block的適用場景：橫向導航欄。通常，我們一般會設定a元素display：block然後進行浮動來製作。有時候我會直接通過對列表元素設定display:inline來製作。如果在製作中，你需要設定不同的display屬性來處理浮動，那麼inline-block不失為一種更好的解決方案。
當你需要將元素排列成一行或者多行時，更傾向於考慮使用inline-block代替float。當然，直接使用table也是一種方法，他畢竟是專門用來處理橫向與縱向排列的元素的。
如果你需要建立乙個很複雜的包含行列的布局，table是你的最佳選擇，不過你同樣也可以考慮inline-block
總結inline-block元素帶有一些行內元素的特徵（橫向排列），同時內部也擁有塊級元素的屬性。這個跟浮動很類似，只不過有些區別。
這些區別決定了你該使用哪種方案。如果你很糾結垂直對齊問題或者橫向排列元素，不妨使用inline-block。如果你需要對乙個元素跟圍繞他的一些元素進行更多控制，你需要浮動。
當然，table也是你處理一些問題的最佳方案。
同樣我想說的，這不是什麼新東西，但我會通過這篇文件還有demo來介紹一些應該使用但有些人尚未使用inline-block的場景。
絕對定位absolute和浮動定位float的異同
absolute 生成絕對定位的元素，相對於最近一級的定位不是 static 的父元素來進行定位。fixed 老ie不支援 生成絕對定位的元素，通常相對於瀏覽器視窗或 frame 進行定位。relative 生成相對定位的元素，相對於其在普通流中的位置進行定位。static 預設值。沒有定位，元素出...
最短路徑 大話Dijkstra演算法和Floyd演算法
dijkstra演算法 演算法描述 1 演算法思想 設g v,e 是乙個帶權有向圖，把圖中頂點集合v分成兩組，第一組為已求出最短路徑的頂點集合 用s表示，初始時s中只有乙個源點，以後每求得一條最短路徑 就將加入到集合s中，直到全部頂點都加入到s中，演算法就結束了 第二組為其餘未確定最短路徑的頂點集合...
inline block和float應區別對待
參考資料 inline block和float大戰已經持續了一段時間，有的人鍾愛float，整個頁面都用的是float布局，而有些人因為float之後的元素會脫離文件流，而鍾情於inline block。今天因為在做任務，使用inline block出現了一點小問題，為加深記憶，特寫此博文。floa...