部分覆蓋100％的視口高度

我在這個網站（和其他人）做了大量的研究，但我不能解決我的問題... 在這個網站上：http://vintagebike.fr/t%C3%A9t%C3%A9/ 我希望每個部分涵蓋100％的視口的高度...... 我設置在最小高度：100％eachs ... 我設置了HTML，身體的高度：100％部分覆蓋100％的視口高度

一些代碼：

html{ overflow-y:scroll; font-size:100%; font-family:Arial,Helvetica,sans-serif; line-height:1.5; background:url(...) repeat top left; font-color:#353232; height:100%;} 



body{ height:100%; background:#fff; float:left; width:100%; font-size:.8125em; color:#353232;} 

#about{background-color: #cde2f3;position:relative;min-height:100%;} 
#elements{background-color: #fbe2e4;position:relative;min-height:100%;} 
#pourqui{background-color: #ffedc1;position:relative;min-height:100%;} 
#contact{background-color: #ddeee4;position:relative;min-height:100%;}

如果我設定的高度以像素爲單位...

我真的不明白...

在此先感謝。

（對不起，我的英語）

來源

2013-02-06 Theoalran

你能否提供一些代碼？ – UpHelix

對不起。我編輯了我的第一條消息... – Theoalran

閱讀的percentage height規範。它與視口無關。既然你有body {height:100%}，隨着BODY的增長，它成爲代表100％的元素，而不是視口。

您需要根據瀏覽器的視口大小使用JavaScript設置截面高度。

Bonne的機會。

指定百分比高度。百分比的計算方法爲：，包含的產生盒子的高度。如果未明確指定包含塊的高度（即，其取決於內容高度），並且該元素不是絕對定位，則該值計算爲'auto'。根元素上的百分比高度相對於初始包含塊。注意：對於絕對定位的元素，其含有的塊基於塊級元素，則相對於該元素的填充框的高度計算百分比。這是從CSS1, 的變化，其中百分比總是相對於父元素的內容框計算。

來源

2013-02-06 21:40:37

嗡嗡聲...我不確定我是否理解你的評論...當看到http://dev.manifold.ws/test/（在其他帖子中發現的相對於100％身高）時，我調整窗口的高度，每個部分的適應... 我還是不明白爲什麼它不能在我的網站上工作... – Theoalran

哇，很酷。我看到的不同：在BODY上沒有'float：left'，在HTML上沒有'overflow-y：scroll'。 –

...我只是嘗試刪除它，但沒有結果。 – Theoalran

部分覆蓋100％的視口高度

回答

相關問題