爲什麼衆所周知的粘腳註腳本是這樣的？

這是衆所周知的腳本http://ryanfait.com/sticky-footer/：粘腳腳本！爲什麼衆所周知的粘腳註腳本是這樣的？

粘性頁腳保留在視口的底部，除非內容更長。美麗。

但現在，這裏是一個腳本似乎做同樣的事情。
的HTML：

<div id="container"> 
    <div id="content"> 
     (Paste here your content.) 
    </div> 
    <div id="push"></div> 
    <div id="footer"> 
     FOOTER 
    </div> 
</div>

而CSS：

* { 
    margin: 0px; 
    padding: 0px; 
} 
html, body { 
    width: 100%; 
    height: 100%; 
} 

div#container { 
    position: relative; 
    width: 1000px; 
    min-height: 100%; 
} 

div#push { 
    height: 32px; 
} 

div#footer { 
    position: absolute; 
    bottom: 0px; 
    height: 32px; 
    width: 100%; 
}

所以，如果你把知名粘頁腳腳本相反礦（如上），這是我應該用？有沒有優點或缺點？

來源

2012-03-21 MC Emperor

如果它們都起作用，那沒關係。我會使用適用於大多數瀏覽器的瀏覽器。 – Blender 2012-03-21 21:26:44

你的代碼很好很簡單，但我認爲它會因爲跨瀏覽器的兼容性而失敗。如果您使用主要瀏覽器和版本進行測試 - 請使用您的代碼:) – 2012-03-21 21:27:44

應該注意的是，使用'* {margin：0;填充：0;}'。對於上面的概念代碼的證明是可以的，但是在現場環境中它太過寬泛，並且可能使表單樣式變得不必要地困難。 – Moses 2012-03-21 21:31:13

您的代碼對於較早版本的IE似乎失敗，因爲它們不支持min-height。其他代碼實現了一種解決方法，以便它仍然適用於這些瀏覽器。請閱讀http://ryanfait.com/resources/footer-stick-to-bottom-of-page/關於「height: auto !important;和height: 100%;屬性」的最後部分。

來源

2012-06-13 19:32:24

因此，代碼本身（無人注意的舊版瀏覽器）確實有效，是否有效並且更短？ – 2012-06-14 19:01:40

是的，我相信是的。它在我用chrome測試它時起作用，並且我沒有注意到它會導致它在任何其他現代瀏覽器中失敗。 – 2012-06-14 19:06:55

爲什麼衆所周知的粘腳註腳本是這樣的？

回答

相關問題