<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <body style="height:100%"></body> </html>就這麼簡單的一段，然後我直覺的認為body的高度一定等同於browser中inner window的高度。一定是吧，我都設定了body高度是100%了啊。幹！但不是，我想了一整天一直覺得Chrome有bug，但是後來發現IE/FireFox也是 ... 所以，媽的，這應該是我腦袋裡的bug ... 還好我後來遇到一個神人(Tim.yellow) ，他立刻就可以跟我說這是因為我的DOCTYPE宣告會讓瀏覽器進入Stirct模式（這模式的歷史來自於早期瀏覽器各家沒有完整遵守W3C spec的關係。因此後來有了這個模式是為了相容在當年錯誤的狀況下產生的網頁的兼容性。我的認知大概是這樣，如果有錯神人Tim會幫我修改XD) ，在Strict模式下，整個viewport的root是html。 所以為了讓這段簡單的HTML符合我的預期，必須幫HTML也加上height style才能夠影響整個viewport的高度：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html style="height:100%"> <body style="height:100%"></body> </html>
這樣寫就好了耶。果然是神人Tim。
或者是：
<html> <body style="height:100%"></body> </html>什麼都不寫，就會進入Quirks Mode，這時候的root是body，所以高度就真的會是100%。
感謝來自雲端的神人 Tim :)
因為這篇文章，也查到了ie9 該如何emulate quirk mode. http://msdn.microsoft.com/en-us/library/gg558047(v=vs.85).aspx ， 這裡說到quirks mode 的 body 的高度預設是佔滿整個view port的。 還有很多特別的行為也都在裡面，比如說，hover 只能在link上使用.
回覆刪除這一篇更是仔細說明 http://www.cs.tut.fi/~jkorpela/quirks-mode.html quirk mode的Root element是 body, 所以body設100%沒問題。 但是現在的標準是以html這個elemtn當作root, 所以在標準的mode下，要把html設成100%才能達成我們的需求。
果然是來自雲端的神人，補充得好完整噢。不過我是不是把quirks mode跟標準mode搞反了 XDDDD
回覆刪除作者已經移除這則留言。
回覆刪除是我們第一次討論的時候，太荒亂了，大家沒有弄清楚~
回覆刪除