html頁面高度不固定在不同瀏覽器下的兼容性設置

2024-07-11 08:50:15

字體：大中小

來源：轉載

供稿：網友

頁面需要嵌套在跨域的iframe中，而頁面高度不固定，需要每個頁面把自己的高度獲得后，通過js通知iframe調整顯示。
而頁面在獲得自己的高度時，發現總是比預想的大。經過參考別人的博客，發現原來是w3c標準的原因。
也就是要在<html>前面加上<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
加上之后，document.documentElement.scrollHeight在IE和Chrome下，可以正常取到合適的全文高度，但是firefox下取到的則過高；用document.body.scrollHeight取則恰好相反。
因此最后采用了Math.min(document.documentElement.scrollHeight,document.body.scrollHeight)獲得最小高度，正常。
但是加上W3C標準后，畫面也出現了一些小的不同，比如頁面的行間距，似乎IE的就要短一些，有些地方重合了。而且css也會嚴格區分大小寫。

參考文章url：
http://m.survivalescaperooms.com/article/19844.htm
http://m.survivalescaperooms.com/article/32874.htm

內容：
js獲取頁面高度 2011-06-02 14:20:02| 分類：JavaScript | 標簽：body document clientwidth 寬度頁面高度 |字號大中小訂閱.

復制代碼

上一篇：仿Word自動套用格式使用CSS設置表格樣式實例

下一篇：div+css背景漸變色代碼示例