固定頁眉和頁腳gotchas和建議

我打算修改我的博客佈局，這次我打算有position: fixed頁眉和頁腳，兩者都將高約40px。標題將包含徽標和搜索按鈕，頁腳將包含許多項目，如訂閱按鈕，相關帖子，跳轉到頂部/評論/底部按鈕等等（列表未定稿）。固定頁眉和頁腳gotchas和建議

在我進入這個之前，我想知道如果有人能告訴我它是否是個好主意。如果您能指出最佳做法和陷阱，我也會很感激。頁腳將包含相關帖子和一些其他功能的Facebook聊天風格彈出窗口，所以我也想知道它是否會使用這種佈局。也會有廣告，所以這讓我很擔心，如果它可能有一個頭頂廣告（特別是Flash廣告）。樣本佈局的鏈接將不勝感激。

來源

2010-05-26 Salman A

不管這是個好主意都取決於你 - 畢竟你是設計師。您需要注意的唯一問題是您的所有內容都將可見，並且頁眉和頁腳不會阻礙任何內容。你可以很容易地防止這種通過設置填充到對應於頁眉和頁腳的高度你的身體元素：

body { 
    padding: 40px 0 50px 0; 
} 

#header { 
    position: fixed; 
    top: 0; 
    height: 40px; 
} 

#footer { 
    position: fixed; 
    bottom: 0; 
    height: 50px; 
}

關於以顯示在flash內容要素;您的閃存元素必須有wmode參數設置爲opaque：

<param name="wmode" value="opaque" />

來源

2010-05-26 11:02:38

固定頁眉和頁腳gotchas和建議

回答

相關問題