2012-08-14 91 views
0

我遇到此頁面有問題。標題之後的區域(它表示Hello!)應該是#33333(灰色)而不是綠色。我知道它會變得非常簡單。任何幫助?HTML頁面錯誤

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<LINK REL="icon" HREF="favicon.ico" TYPE="image/x-icon"> 
<LINK REL="shortcut icon" HREF="favicon.ico" TYPE="image/x-icon"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Unavit</title> 
<style type="text/css"></style> 
<link href="css/layout.css" rel="stylesheet" type="text/css" /> 
<link rel="stylesheet" href="css/css.css" type="text/css"> 
<!--[if lt IE 8]><link rel="stylesheet" type="text/css" href="css/early_ie.css" /><![endif]--> 
<style type="text/css"> 

</style> 
</head> 
<body> 
<div id="mapsHeader"> 
     <div id="mapsBanner"></div> 
</div> 
<div id="mapsContent"> 
    <div id="mapsBodyArea"> 
     Hello! 
    </div> 
</div> 
<div id="footer"> 
    <div id="container"> 
     <div id="bottomNav"> 
      <table width="1029"> 
       <tr> 
        <td align ="center" width="87"><font color = "#333"><a href="index.html">HOME</a></font></td> 
        <td>|</td> 
        <td align ="center" width="121"><font color = "#333"><a href="aboutus.html">ABOUT US</a></font></td> 
        <td>|</td> 
        <td align ="center" width="99"><font color = "#333"><a href="joinus.html">JOIN US</a></font></td> 
        <td>|</td> 
        <td align ="center" width="134"><font color = "#333"><a href="contact.html">CONTACT US</a></font></td> 
        <td>|</td> 
        <td align ="center" width="61"><font color = "#333"><a href="faq.html">FAQ</a></font></td> 
        <td>|</td> 
        <td align ="center" width="213"><font color = "#333"><a href="terms.html">PRIVACY & TERMS</a></font></td> 
        <td align ="center" width="175"><font color = "#333">&copy;Unavit 2012</font></td> 
        <td align ="center" width="48" height="50"><a href="http://twitter.com" target="_blank"><img src="images/tweet.png" width="50" height="50"/></a></td> 
        <td align ="center" width="51" height ="50"><a href="http://facebook.com" target="_blank"><img src="images/face.png" width="50" height="50"/></a></td> 
       </tr> 
      </table>  
     </div> 
    </div> 
</div> 
</body> 
</html> 

這裏是CSS:

* { 
    margin: 0px; 
    padding: 0px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 19px; 
    color: #33333; 
} 
ol { 
    margin:1em 0 1em 3em; 
} 
ul { 
    list-style:disc; 
    margin:1em 0 1em 3em; 
} 
li { 
    margin:.3em 0 
} 
body { 
    background-color: #9FCC3A; 
    font-family: "Comic Sans MS", cursive; 
} 
a { 
    text-decoration: none; 
    color: #333; 
} 
a:link { 
    text-decoration:none; 
    color: #333; 
} 
a:hover{ 
    text-decoration:none; 
    color: #333; 
} 
a:visited{ 
    text-decoration:none; 
    color: #333; 
} 
a:active { 
    text-decoration: none; 
    color: #333; 
} 

#header { 
    background-color: #33C0C5; 
    height: 240px; 
    overflow: hidden; 
    width: 100%; 
} 

#mapsHeader { 
    height: 67px; 
    overflow: hidden; 
    width: 100%; 
} 

#header #banner { 
    width: 1028px; 
    left: auto; 
    right:auto; 
    margin-right: auto; 
    margin-left: auto; 
} 

#mapsHeader #mapsBanner { 
    width: 100%; 
    height: 67px; 
    left: auto; 
    right: auto; 
    margin-right: auto; 
    margin-left: auto; 
    background-image: url(../images/mapsBanner.png); 
    background-repeat: repeat-x; 
} 
#mapsContent { 
    width: 100%; 
    height: auto; 
    background-color: #33333; 
    overflow: hidden; 
} 

#mapsContent #mapsBodyArea{ 
    width: 1028px; 
    margin-right: auto; 
    margin-left: auto; 
} 

#content { 
    width: 100%; 
    height: auto; 
    background-color: #FFFFFF; 
    overflow: hidden; 
} 

#content #bodyArea{ 
    width: 1028px; 
    margin-right: auto; 
    margin-left: auto; 
} 

#content #bodyArea #mapsRight { 
    width: 773px; 
    float: right; 
} 
#content #bodyArea #mapsLeft { 
    width: 255px; 
    float: left; 
} 

#content #bodyArea #leftJoin{ 
    width: 107px; 
    float: left; 
} 

#content #bodyArea #rightJoin{ 
    width: 921px; 
    float: right; 
} 

#content #bodyArea #mapBoxSpacer { 
    height: 33px; 
} 

#content #bodyArea #mapBoxSpacer2 { 
    height: 50px; 
} 

#content #bodyArea #spacer{ 
    height: 100px; 
} 

#content #bodyArea #smallSpacer { 
    height: 15px; 
    clear: both; 
} 

#content #bodyArea #spacer1{ 
    height: 50px; 
} 

#content #bodyArea #left { 
    width: 586px; 
    float: left; 
} 

#content #bodyArea #aboutTitle { 
    width: 1028; 
} 

#content #bodyArea #leftAbout { 
    width: 450px; 
    float: left; 
} 

#content #bodyArea #rightAbout { 
    width: 574px; 
    float: left; 
} 

#content #bodyArea #left #nav { 
    position: relative; 
} 
#img2 { 
    position: absolute; 
    left: 21px; 
    top: 25px; 
} 
#img3 { 
    position: absolute; 
    left: 21px; 
    top: 75px; 
} 
#img4 { 
    position: absolute; 
    left: 21px; 
    top: 125px; 
} 
#img5 { 
    position: absolute; 
    left: 21px; 
    top: 175px; 
} 
#img6 { 
    position: absolute; 
    left: 21px; 
    top: 225px; 
} 
#navFont { 
    font-size: 15pt; 
    font-family: Arial, Helvetica, sans-serif; 
} 

#content #bodyArea #left #spacerLeft { 
    height:15px; 
} 
#content #bodyArea #right { 
    width: 442px; 
    float: right; 
} 
#content #bodyArea #right #spacerRight { 
    height: 10px; 
} 
#content #bodyArea #right #clear { 
    width: 590px; 
    clear: both; 
} 
#content #bodyArea #right #rightLeft { 
    width: 295px; 
    float: left; 
} 
#content #bodyArea #right #rightRight { 
    width: 290px; 
    float: right; 
} 
#content #bodyArea #right #rightRight #spacerRightRight { 
    height: 10px; 
} 
#footer { 
    background-color: #9FCC3A; 
    width: 100%; 
    overflow: hidden; 
} 

#footer #container { 
    clear: both; 
    width: 1028px; 
    height: 50px; 
    margin-right: auto; 
    margin-left: auto; 
} 
#footer #container #bottomNav { 
    width: 1028px; 
    float: right; 
    color: #333; 
} 
#footer #container #spacerFooter { 
    width: 191 px; 
    float: left; 
} 
#footer #container #clearFooter { 
    clear:both; 
} 

回答

4

你的規則是:

#mapsContent { 
    width: 100%; 
    height: auto; 
    background-color: #33333; 
    overflow: hidden; 
} 

當它應該是

background-color: #333333; 

你是一個三短。

+0

哈哈,我知道它會這麼小。謝謝!將盡我所能接受。 – LiverpoolFTW 2012-08-14 02:40:36

+2

+1 @LiverpoolFTW注意:還有一些其他位置,你有'#33333;'(缺少一個數字)。我看到你在幾個地方使用'#333;'也沒問題,但你應該嘗試保持一致。我通常避免使用簡寫方法,輸入完整的6位數字十六進制不會太長,如果要調整它,以後更改速度會更快。 – 2012-08-14 02:41:50