w3c標準自適應高度height100%不起作用的問題分析
發(fā)布時間：2008-10-30 14:16:26 作者：佚名 
我要評論
我要評論Firefox中的HTML標簽不是 100%高度，因此給兩個標簽都定義為height:100%;以保證兩個瀏覽器下均能夠正常顯示。
在以前的網(wǎng)頁中，table用height:100%是可以整屏的，但在網(wǎng)頁頭部增加:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
后就和沒有用height:100%一樣了，后來發(fā)現(xiàn)要給html,body都增加height:100%的屬性，這是高度自適應問題的關鍵所在。
html,body{
margin:0px;
height:100%;
}
一個對象高度是否可以使用百分比顯示，取決于對象的父級對象，Table在body之中，因此它的父級是body，而瀏覽器默認狀態(tài)下，是沒有給body一個高度屬性的，因此當我們直接設置#left為height:100%;時，不會產(chǎn)生任何效果，而當我們給body設置了100%之后，它的子級對象Table的height:100%;便發(fā)生作用了，這便是瀏覽器解析規(guī)則引發(fā)的高度自適應問題。而代碼中除了給body應用之外，還給 HTML對象也應用相同的樣式設計，這樣做的好處是使IE與firefox瀏覽器都能夠?qū)崿F(xiàn)高度自適應。另外，F(xiàn)irefox中的HTML標簽不是 100%高度，因此給兩個標簽都定義為height:100%;以保證兩個瀏覽器下均能夠正常顯示。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
后就和沒有用height:100%一樣了，后來發(fā)現(xiàn)要給html,body都增加height:100%的屬性，這是高度自適應問題的關鍵所在。
復制代碼
代碼如下:html,body{
margin:0px;
height:100%;
}
一個對象高度是否可以使用百分比顯示，取決于對象的父級對象，Table在body之中，因此它的父級是body，而瀏覽器默認狀態(tài)下，是沒有給body一個高度屬性的，因此當我們直接設置#left為height:100%;時，不會產(chǎn)生任何效果，而當我們給body設置了100%之后，它的子級對象Table的height:100%;便發(fā)生作用了，這便是瀏覽器解析規(guī)則引發(fā)的高度自適應問題。而代碼中除了給body應用之外，還給 HTML對象也應用相同的樣式設計，這樣做的好處是使IE與firefox瀏覽器都能夠?qū)崿F(xiàn)高度自適應。另外，F(xiàn)irefox中的HTML標簽不是 100%高度，因此給兩個標簽都定義為height:100%;以保證兩個瀏覽器下均能夠正常顯示。
相關文章
AudioContext 實現(xiàn)音頻可視化(web技術分享)
這篇文章主要分享的是web技術的 AudioContext 實現(xiàn)音頻可視化，要實現(xiàn)音頻可視化得先實現(xiàn)一些炫酷的效果需要借助 Web Audio API提供的一些方法 AudioContext，下面詳細內(nèi)容2022-02-23
這篇文章主要給大家介紹了web技術中的WebRTC記錄音視頻流，文章內(nèi)容圍繞主題展相關資料，需要的小伙伴可以參考一下，希望對你有所幫助2022-02-23- 這是我通過網(wǎng)上查閱資料總結(jié)的一些編碼規(guī)范，用于鞏固對html，css頁面重構(gòu)時的基礎,需要的朋友可以參考下2020-12-19
前端編碼規(guī)范（4）—— CSS 和 Sass (SCSS) 開發(fā)規(guī)范
這篇文章主要介紹了前端編碼規(guī)范（4）—— CSS 和 Sass (SCSS) 開發(fā)規(guī)范,需要的朋友可以參考下2017-01-21Web前端開發(fā)規(guī)范2017(HTML/JavaScript/CSS)
這是一份旨在增強團隊的開發(fā)協(xié)作，提高代碼質(zhì)量和打造開發(fā)基石的編碼風格規(guī)范，其中包含了 HTML, JavaScript 和 CSS/SCSS 這幾個部分。我們知道，當一個團隊開始指定并實行2017-01-21- 這篇文章主要為大家介紹了前端開發(fā)團隊遵循和約定的代碼書寫規(guī)范，意在提高代碼的規(guī)范性和可維護性,需要的朋友可以參考下2017-01-21
- 這篇文章主要為大家詳細介紹了響應式Web之流式網(wǎng)格系統(tǒng)的相關資料，感興趣的小伙伴們可以參考一下2016-07-04
在網(wǎng)頁標題欄上和收藏夾顯示網(wǎng)站logo的實現(xiàn)方法
下面小編就為大家分享一篇在網(wǎng)頁標題欄上和收藏夾顯示網(wǎng)站logo的實現(xiàn)方法。希望對大家有所幫助。一起跟隨小編過來看看吧，祝大家游戲愉快哦2016-03-16Visual Foxpro 6.0 中文版安裝向?qū)?圖解)
基于很多用戶都在下載Visual Foxpro 6.0，但是有安裝vtp6.0經(jīng)驗的朋友確很少，在安裝過程中總會出現(xiàn)這樣那樣的問題，基于這些問題，下面小編抽個時間把Visual Foxpro 6.02015-09-09網(wǎng)站日志200 0 64狀態(tài)碼的分析(協(xié)議子狀態(tài))
網(wǎng)站日志200 0 64狀態(tài)碼的分析介紹2012-10-29
