Facebook-like header/Top bar

我一直在試圖用一些CSS來撰寫這個類似Facebook的頂欄（或者標題，我不知道）。我認爲這很容易，而且，第一個結果確實是。Facebook-like header/Top bar

我已經設置了fixed位置的酒吧，其top和left屬性設置爲0，其padding設置爲4px和它的偉大工程;就像我想要的一樣。

但現在的問題是......內容如何？我可以簡單地將它包裹在<div>內，並將其相對放置幾個em s到其底部。但是，如果它超過瀏覽器的最大高度，是不是會隱藏內容的底部？此外，這可能會導致一些尺寸與某些瀏覽器不兼容（我討厭IE）。

對不起，如果這已經被問到這裏，我找不到這樣的問題。更清楚的是，我不希望任何形式的「dinamically-updates」頭文件 - 至少現在還沒有。我想我可以用一些HTML5做到這一點。

這裏的主要問題是：做這樣的頭部的最佳方式是什麼？ position: fixed是真正的路要走嗎？如果是這樣，顯示內容的最佳方式是什麼？

TIA，安德烈

你應該明確你的意思是類似Facebook的。他們可能會改變他們的界面，使你的問題過時，除非你提到你想要達到的具體事情。 – Jacob 2012-08-02 02:16:06

好點。但我怎麼能描述它呢？我認爲「沒有內容隱藏在內容底部的固定頂部欄」有點太大了。 – 2012-08-02 02:18:11

position:fixed會做。

簡單地爲您的內容頂部添加邊距。（與您的標題的高度相同）。

因此，當您位於頁面頂部時，您的標題將覆蓋邊距。當您向下滾動時，它將按預期行事。瀏覽器不會隱藏底部。

2012-08-02 02:18:29 Madushan

嗯。你的意思是，像一些JavaScript來獲得標題的高度（因爲我不會通過CSS來設置它），並將其設置爲DOM Content Load上的內容的頂部邊距？ – 2012-08-02 02:20:51

我期待您的標題高度是通過CSS靜態設置的。隨你便。但是你真的想要調整大小的標題嗎？這對用戶來說會不會有點尷尬？ – Madushan 2012-08-02 02:26:15

不是調整大小的標題。就是這樣，我現在設計的方式，我沒有靜態設置高度。它的高度只是由字體的大小加上填充來創建的。 Javascript是一個簡單的部分。只要問題超時，我就會將此答案計爲已接受。謝謝。 – 2012-08-02 02:28:40

回答