網頁布局中經常要定義元素的寬和高。但很多時候我們希望元素的大小能夠根據視窗或子元素自動調整，這就是pc端自適應。
自適應的優點：
元素自適應在網頁布局中非常重要，它能夠使網頁顯示更靈活，可以適應在不同裝置、不同視窗和不同解析度下顯示。
相對視窗和父元素的自適應寫法：
寬度：當塊狀元素不寫寬度的時候，預設的寬度就是100%； 是父元素的寬度的100%；也就是始終跟父元素是同寬的。
width：100%；預設情況下：如果給塊元素加了絕對定位或者固定定位，他的寬度就不在是100%顯示了。也不會跟父元素同寬的，而是跟裡面的內容同寬，如果元素裡面沒有內容，有沒有定義寬高，這個時候，元素就不見了
高度：當讓元素的高度相對瀏覽器視窗顯示半分比的值得時候，一定要給html和body設定高度100%；
高度自適應：
相對視窗自適應 html,body （全屏顯示的頁面必須要給 html,body設定高度100%）
注：百分比設定寬高的時候，都是相對當前元素最近的父元素顯得的百分比的值(百分比這個值顯示大小的參照物就是自己最近的父元素)
相對元素或者內容的自適應寫法：
一： 非浮動元素的父元素高度自適應
實現方法：
1、不設定高度，或者高度設定成： height:auto；
2、通過最小高度實現高度自適應 ： min-height:300px;height:300px;
3、給需要高度自適應的元素新增這些屬性：
min-height:value; height:auto !important;height:value;
注：帶有!important；關鍵字過濾器的屬性，要寫到相同屬性之前；
相容ie6的寫法：
/_height:300px;/ /* 「」 叫做下劃線過濾器，加了下劃線過濾器之後，只有ie6 這個瀏覽器識別當前的屬性，其他瀏覽器就都不識別了。 /
height:auto !important;/ 具有最高優先順序，有的的瀏覽器都會去識別這具有!important；過濾器的這個屬性；!important; 對於ie6來說，是無效的，ie6不支援*/
height:300px;/* 專門讓ie6識別的 */!important； 關鍵字過濾器，具有最高優先順序；ie6不支援；
二 ：浮動元素的父元素高度自適應
說明：當父元素不設定高度的時候，第一級子元素浮動後，父元素高度塌陷；
怎麼去解決這個問題？
1、可以個固定高度去解決解決高度塌陷問題
缺點：但是不能讓元素高度自適應了 。
2、overflow：hidden; 解決高度塌陷並能實現高度自適應
缺點：只要裡面的內容或者元素超出父元素以外，就會被隱藏；
3、在浮動元素的下方新增乙個空元素，並且給他設定一下屬性：空標記：
clear:both;height:0;overflow:hidden;
缺點：會新增很多空標記，增加結構負擔，產生**冗餘；
4、display:table; 給父元素新增display：table；讓父元素轉換元素型別跟**的特性一樣；
缺點：會改變當前元素的元素型別；
5、萬能清除法：
:after說明：推薦使用萬能清除法；
缺點：**過多；
偽元素（物件）選擇器：（這幾個偽元素選擇器前面的冒號可寫一組，也可以寫兩組；）
1、::after : 與content屬性一起使用，定義在物件後的內容。（必須具有屬性content：「」；）
語法：選擇符: ：after
2、::before : 與content屬性一起使用,定義在物件前 的內容。
語法：選擇符: ：before
3 ::first-letter 定義物件內第乙個字元的樣式。
說明：(該偽元素只能用於塊級元素)
4 ::first-line:定義物件內第一行的樣式。
說明：(該偽元素只能用於塊級元素。)
隱藏屬性：visibility:visible 顯示/hidden 隱藏;
visibility:hidden;和display:none;的區別：
visibility:hidden;屬性會使物件不可見，但該物件在網頁所佔的空間沒有改變，等於留出了一塊空白區域；
而 display:none屬性會使這個物件徹底消失不顯示，也不再占用位置。
區別visibility:hidden；讓元素隱藏；元素的位置是保留的；
display:none：讓元素隱藏； 元素的位置不保留，也被隱藏了；
寬高自適應
網頁布局中經常要定義元素的寬和高。但是很多時候我們希望元素的大小能夠根據視窗或子元素自動調整，這就是自適應 元素自適應在網頁布局中非常重要，他能夠使網頁顯示更加靈活，可以適應在不同裝置 不同視窗和不同解析度下顯示 1.寬度自適應 元素寬度設定為100 塊元素寬度預設為100 2.元素具備最小高度的自...
寬高自適應
寬高自適應 靈活 網頁布局中經常要定義元素的寬和高。但很多時候我們希望元素的大小能夠根據視窗或子元素自動調整，這就是pc自適應。自適應的優點 元素自適應在網頁布局中非常重要，它能夠使網頁顯示更靈活，可以適應在不同裝置 不同視窗和不同解析度下顯示。一 相對視窗和父元素的自適應寫法 寬度 width 1...
寬高自適應
寬高自適應可以使得網頁更加靈活，適應在不同的裝置不同解析度下。一 pc端寬高自適應 相對視窗或者父元素的自適應情況 寬度自適應 width 100 預設情況下，不新增定位時 寬度自適應的比例，是參照父元素的寬度進行顯示的，也就是說，如果元素的父元素是整個頁面的話，顯示的時候就是鋪滿整個螢幕 如果當父...