使菜單欄和標識按照網頁滾動

當我試圖讓我的標誌和馬努酒吧跟隨我的網頁，我向下滾動頁面，使菜單欄和標識按照網頁滾動

目前，這是我有什麼。

CSS is;

html,body { 
background-image:url(../img/background.png); 
background-size:cover; 
background:fixed; 
} 


#bar { 
margin-top:55px; 
width: 1920px center; 
height: 30px; 
background: #2E2E2E; 
border: 3.2px groove #FFD700; 
} 
#logo { 
position:absolute; 
background-image:url(../img/LOGO1.png); 
background-size:150px; 
width:150px; 
height:150px; 
margin:0 auto; 
z-index:1; 
top:0px; 
margin: 0 auto; 
left:0px; 
right:0px; 
} 
#middle 
{ 
height:10000px; 
}

和HTML：

</head> 
<body> 
<div id="logo"> 
</div> 
<div id="bar"> 
</div> 
<div id="middle"> 
</div> 
</body> 
</html>

所以請，我會需要什麼改變來使雙方的酒吧「和「標誌」按照我的滾動。

三江源你幫

來源

2014-01-27 bjbear123

你會添加'位置：fixed'的元素 –

謝謝，我只是補充說，兩個酒吧和標誌，但它使酒吧小，並在左邊， – bjbear123

這裏是我會怎麼做它的jsfiddle ...

http://jsfiddle.net/2Zqhw/

我包裹在一個div這兩個元素，給它position:fixed和width:100%

來源

2014-01-27 17:28:35 Dijon

您可以嘗試在另一個div中嵌套徽標和欄，然後在封閉div上設置position:fixed，以便您的HTML看起來像這樣：

<div id="fixed_bar" style="position:fixed;"> 
    <div id="logo"/> 
    <div id="bar"/> 
</div> 
<div id="middle"> 
</div>

或者你可以在CSS中添加封閉DIV同上，但定義樣式吧：

#fixed_bar 
{ 
    position:fixed; 
}

隨着HTML：

<div id="fixed_bar"> 
    <div id="logo"/> 
    <div id="bar"/> 
</div> 
<div id="middle"> 
</div>

來源

2014-01-27 17:28:49 Pineda

你需要一個div來包裝您的徽標和酒吧，並使用CSS將位置設置爲固定。

的CSS：

#nav-fixed { 
    position:fixed; 
}

的HTML：

<div id="nav-fixed"> 

    <div id="logo"> 
    </div> 

    <div id="bar"> 
    </div> 

</div>

來源

2014-01-27 17:33:07 Justin

使菜單欄和標識按照網頁滾動

回答

相關問題