2013-01-12 179 views
-1
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="stylesheets\sets1.css"> 
</head> 
<style type="text/css"> 
body                 /* site bg color */ 
    { 
    margin: 0; 
    background-color:#b0c4de 
    } 

#navbar ul { 
    margin: 0; 
    padding: 5px; 
    cellspacing: 0; 
    cellpadding: 0; 
    border: 0; 
    list-style-type: none; 
    background-color: #8B008B; 
    } 

#navbar ul li { 
    display: inline; 
    } 

#navbar ul li a { 
    text-decoration: none; 
    padding: .2em 1em; 
    color: white; 
    background-color: #8B008B; 
    } 

#navbar ul li a:hover { 
    color: #0EC6D7; 
    background-color: #8B008B; 
    } 

</style> 
</head> 
<body> 
    <div id="navbar"> 
    <ul> 
    <li><a href="http://"><img src="images/logo.png" alt="Site Logo" height="50" width="68"></img></a></li> 
    <li><a href="#">Forum's</a></li> 
    <li><a href="#">Chat's</a></li> 
    <li><a href="#">Login</a></li> 
    <li><a href="#">Sign up</a></li> 
    </ul> 
</div> 
</body> 
</html> 

增加的邊距:0;到身體標記,它的作品像fb標題覆蓋整個頁面頂部沒有空白或無知的打破或任何這樣的事情也是它的跨瀏覽器,所以非常感謝。感謝所有幫助我的用戶使CSS導航欄封面頂部

回答

1

設置margin在體內

body{ 
margin:0px; 
background-color:#b0c4de 
} 

如果你想在導航欄跨越整個頁面的頂部嘗試設置寬度這將消除身體周圍

任何空格0像素到100%

#navbar{ 
position:relative; 
width:100px; 
height:auto; 
background-color: #8B008B; 
} 

這將使頁面頂部的品紅色欄。不知道你想要什麼樣的高度,所以我把它變成自動的,所以它會根據內容重新調整大小。然後,您可以將您的徽標圖像放在此div內。

3

如果你的意思是「粘性」頭然後使用位置:固定

#navbar{ 
    position:fixed; 
    top:0; 
    left:0; 
} 

您可能需要定義寬度,z-index的,或其他任何具體到你的設計,但是這是基本的想法。

如果你不是指粘性,那麼威廉姆斯可能會得到答案。

+0

這將創建一個粘頭 - 這是他想要的嗎? – AlienWebguy

+0

你知道,你是對的。我只是假定他想粘,因爲我還沒有想到有人不知道如何將nav對齊到頁面頂部......如果你在jsfiddle中運行他的代碼,它會顯示爲正常標題會,沒有空白。 –

-1

您需要將margin: 0;放在車身標籤中。我建議使用可以在google中找到的重置樣式來重置瀏覽器放置的所有空間。