調整高度和居中

-2

我想爲我的網站複製標題/導航（來自www.mineplex.com），但我需要一些幫助。我正在嘗試，但它不起作用。你們的幫助將不勝感激。這是我迄今爲止的代碼。調整高度和居中

body { 
 
    font-family: Helvetica; 
 
    margin: auto; 
 
    width: 100%; 
 
} 
 

 
#header { 
 
    background: #383838; 
 
    position: fixed; 
 
    top: 0; 
 
    width: 100%; 
 
} 
 

 
#container { 
 
    margin: 0 auto; 
 
} 
 

 
#logo { 
 
    color: white; 
 
    font-size: 15; 
 
    text-align: center; 
 
}

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <title>Website</title> 
 
    <link rel="stylesheet" href="style.css" type="text/css" /> 
 
    </head> 
 
\t 
 
    <body> 
 
    <!-- IGNORE THIS! THIS IS FOR LiveReload --> 
 
    <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script> 
 
    <!-- IGNORE THIS! THIS IS FOR LiveReload --> 
 
\t \t 
 
    <div id="header"> 
 
     <div id="container"> 
 
     <div id="logo"> 
 
      <h1>WEBSITE</h1> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </body> 
 
</html>

來源

2015-04-15 tristianchase

似乎沒有成爲一個整體大量的工作，迄今所做的。嘗試至少將您的項目放在標題中而不是佔位符文本中。 – austinthedeveloper

@austinthedeveloper好的。你能告訴我如何將標題下的深色div添加到它嗎？ – tristianchase

你可以通過** inspect元素**瞭解到很多關於網站組件的內容。如果你還沒有嘗試過，那麼.. – shaneparsons

這裏是如何添加暗條在你的頭。 DEMO

HTML：

<div id="header"> 
<div id="container"> 
    <div id="logo"> 
      <h1>WEBSITE</h1> 

    </div> 
</div> 
<div class="header-bottom"></div> 
</div>

CSS：

body { 
font-family: Helvetica; 
margin: auto; 
width: 100%; 
} 
#header { 
background: #383838; 
position: fixed; 
top: 0; 
width: 100%; 
} 
#container { 
margin: 0 auto; 
} 
#logo { 
color: white; 
font-size: 15; 
text-align: center; 
} 
.header-bottom { 
width:100%; 
height:25px; 
background:#1E2224; 
box-shadow: 0px 5px 5px #888888; 
}

來源

2015-04-15 21:44:41 Kinburn101

調整高度和居中

回答

相關問題