寬高自適應
網頁布局中經常要定義元素的寬和高。但很多時候我們希望元素的大小能夠根據視窗或子元素自動調整，這就是pc自適應。
自適應的優點：
元素自適應在網頁布局中非常重要，它能夠使網頁顯示更靈活，可以適應在不同裝置、不同視窗和不同解析度下顯示。
元素寬度設定為100%。（塊元素寬度預設為100%）
或者不設定寬度（width）;（寬度是父元素的寬度）
1)自適應元素高度：height:auto;或者不設定;（是子元素撐開父元素的高度）
2)元素高度自適應視窗高度
設定方法：html,body
注：如果設定子元素的高度跟隨父元素的高度變化而變化，那麼父元素必須有高度。
min-height屬效能滿足：
1）當內容增加的時候，內容能把容器撐開。
2）當內容極少或者沒有內容的時候，讓容器保持乙個最小高度。
(ie6瀏覽器不識別該屬性，但是ie6缺省會把height解析成最小高度)
最小高度的相容設定方法：
1: min-height:300px;_height:300px;
2: min-height:300px;height:auto!important;height:300px;
a:高版本瀏覽器解析順序：
min-height能識別，也能識別！important 所有height:auto;權重最高，height:auto 就能把height:300px覆蓋。
b:ie6解析流程：
min-height不能識別，也不能識別！important , 後寫的height:300px;能把height:auto覆蓋，
當子元素有浮動並且父元素沒有高度的情況下父元素會出現高度塌陷1)給父元素新增宣告overflow:hidden;
原理：overflow：hidden；會觸發乙個bfc（布局邏輯，bfc規定：計算bfc高度時候，浮動元素也參與計算）
缺點：會隱藏掉定位在當前元素外圍的內容
2)在浮動元素下方新增空div,並給該元素新增樣式
div原理：新增的空div新增了clear：both;忽略上方同級新增浮動的元素留出的空間。在父元素最底下顯示，撐開父元素高度。
弊端：形成**的冗餘（出現高度塌陷，新增乙個div）
3）萬能清除浮動法
選擇符:after
visibility:hidden;和display:none;的區別：
1）visibility:hidden;屬性會使物件不可見，但該物件在網頁會佔位置，等於留出了一塊空白區域
2）display:none屬性會使這個物件徹底消失不顯示，也不再占用位置。
1）::after : 在某個元素的後面用css的形式新增內容（、文字）。
語法：選擇符:：after
如：div::after
div::after
2）::before: 在某個元素的前面用css的形式新增內容（、文字）。
div::before
3）::first-letter 定義物件內第乙個字元的樣式。
說明：(該偽元素只能用於塊級元素)
4）、::first-line:定義物件內第一行的樣式。
*(該偽元素只能用於塊級元素。)
粘性定位 寬高自適應 高度塌陷
粘性定位 相容性ie瀏覽器支援度不好 position sticky 可以看做相對定位和固定定位的結合體 一般情況下沒有滾動條滑動內容，內容是佔位的，如果滾動條滑動內容，粘性定位的元素就會有固定定位的效果，方向top才管用 注意點 1 使用的時候需要設定left top bottom right值，...
寬高自適應 偽元素
寬高自適應 網頁布局中經常要定義元素的寬和高。但很多時候我們希望元素的大小能夠根據視窗或子元素自動調整，這就是自適應。元素自適應在網頁布局中非常重要，它能夠使網頁顯示更靈活，可以適應在不同裝置 不同視窗和不同解析度下顯示。寬度自適應 元素寬度設定為100 塊元素寬度預設為100 高度自適應 元素高度...
css寬高自適應及高度塌陷解決方法
偽物件選擇符 網頁布局中經常要定義元素的寬和高。但很多時候我們希望元素的大小能夠根據視窗或子元素自動調整，這就是pc自適應。自適應的優點 元素自適應在網頁布局中非常重要，它能夠使網頁顯示更靈活，可以適應在不同裝置 不同視窗和不同解析度下顯示。元素寬度設定為100 塊元素寬度預設為100 或者不設定寬...