相信很多朋友都會遇到這樣的問題，當(dāng)自己不想設(shè)置一個(gè)div的高度或者不知道它具體高度的時(shí)候，通常都會設(shè)成：height:auto;但跟多時(shí)候，會想把它的高度設(shè)置成100%。以此來適應(yīng)不同分辨率情況下的窗口。
當(dāng)我們也實(shí)際那樣操作就會發(fā)生很奇怪的事情，就像下面看到的，頁面是什么都沒顯示的。
明明設(shè)置了height，那么height去哪兒了呢？
這時(shí)候我們需要知道瀏覽器對于高度的計(jì)算方式。事實(shí)上。瀏覽器是不計(jì)算內(nèi)容的高度。除非當(dāng)內(nèi)容超出視窗范圍，它會出現(xiàn)滾動條。換言之，瀏覽器里面的內(nèi)容都是向下堆砌的。是不考慮高度的。
那么，怎么解決當(dāng)height為100%顯示的問題呢？
一定要注意的是當(dāng)我們用百分比做屬性時(shí)，它是有一個(gè)相對的元素。一般叫父元素。
必須先給定父元素一個(gè)高度。
html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文匯軟件title>
<style type="text/css">
body,html{width:100%;height: 100%;margin: 0 auto;}
div{width: 20%;height: 100%;margin: 0 auto;background-color: #de2829;}
style>
head>
<body>
<div>div>
body>
html>
這樣的話，就可以咯!
