今天分享一下我的css筆記，對於一些難點，我都會編輯在筆記docx上，這是我第一天發表的，希望以後我都會繼續分享一些前端的技術難點，供大家一起討論
css高度塌陷問題
提出問題：子元素脫離文件流後，父元素高度會出現塌陷，造成布局混亂
解決問題：根據w3c標準，頁面中元素都有乙個隱含屬性bfc(block formatting context),該屬性可以設定開啟或關閉，預設關閉
當元素開啟bfc屬性後：
父元素的垂直外邊距不會和子元素重疊
開啟bfc的元素不會被浮動元素覆蓋
開啟bfc的元素能包含浮動的子元素
開啟元素的bfc方式：
設定元素浮動
設定元素絕對定位
設定元素為inline-block
（都能開啟，但會導致父元素寬度丟失）
4.將元素
overflow
：auto
或hidden
為了相容ie8以下的瀏覽器，ie6雖然沒有bfc屬性，但有另外乙個隱含屬性haslayout(layout布局)類似bfc，直接開啟haslayout：
相容問題，解決高度塌陷：
總結：只要父元素開啟了bfc，就能解決高度坍塌問題！不過通常都是使用以下方式來解決：
解決高度塌陷問題的最優方案,通過
css：
通過設定浮動元素的父元素
:after
解決（但不相容
ie6瀏覽器），則可開啟
haslayout
隱藏屬性進而解決高度塌陷
.clearfix : after
clear:both; }
提問：為什麼用
after
而不是用
before？
答：因為坍塌問題，是由於父元素底部出現塌陷，所以設定父元素的
after
表示將子元素之後的父元素內容撐起來，才不會塌陷
如何解決高度塌陷
hello 朋友們，我又來了哦！對的沒錯，今天的話題呢就是高度塌陷。首先要知道什麼是高度塌陷。高度塌陷其實就是指當父元素沒有給確定的高度 即父元素高度靠子元素撐起來 並且子元素新增了浮動時，內容無法撐起父元素的高度，即父元素發生高度塌陷。解決辦法 第一種，開啟元素的bfc，元素將會具有如下的特性 1...
css高度塌陷問題
首先什麼是高度塌陷?當我們需要給頁面設定自適應寬高的時候,在文件流中,父元素的高度預設的情況下是被子元素的高度撐開的,子元素的高度就是父元素的高度,當我們給子元素設定了浮動厚,子元素就會脫離文件流 當你第一次給父元素設定自適應的時候,又給子元素設定浮動元素的時候,你就會發現,父元素的高度沒有了,這就...
解決高度塌陷問題
在文件流中，父元素的高度預設是被子元素撐開的 當為子元素設定浮動後，子元素會完全脫離文件流 此時會導致子元素無法撐起父元素的高度，導致父元素的高度塌陷 由於父元素的高度塌陷了，則父元素下的所有元素都會向上移動，導致頁面布局混亂 所以在開發中需要避免出現高度塌陷的問題 如何開啟元素的bfc 1.設定元...