为什么这个侧边栏背景颜色不会像CSS中指定的那样改变?

时间:2013-03-19 15:18:54

标签: asp.net html css

我开始使用“开始使用ASP.NET 4:在C#和VB中”(Imar Spaanjaars - Wrox)这本书来学习ASP.NET。现在我被困在第79页的“试一试”部分:每件事情都是正确的,除了侧边栏没有背景颜色,预计它会变成灰色。

我的页面:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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 runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            color: #663300;
        }
        .style2
        {
            color: #FF0066;
        }
    </style>
    <link href="Styles/Styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <div id="PageWrapper">
        <div id="Header">
            Header Goes Here
        </div>
        <div id="MenuWrapper">
            Menu Goes Here
        </div>
        <div id="MainContent">
            <h1>
                Hi there visitor and welcome to Planet Wrox</h1>
            <p>
                We&#39;re glad you&#39;re <span class="style2">paying a visit</span><span class="style1">
                </span>to <a href="http://www.PlanetWrox.com">www.PlanetWrox.com</a>, the coolest
                music community site on the Internet.</p>
            <p>
                Feel free to have a look around; there are lots of interesting <strong>reviews and concert
                    pictures </strong>to be found here.</p>
        </div>
        <div id="SideBar">
            Sidebar Goes Here</div>
        <div id="Footer">
            Footer Goes Here
        </div>
    </div>
    </form>
</body>
</html>

CSS文件:

#Header
{
    background-color: #C0C0C0;
    width: 844px;
    height: 86px;
}

*
{
    font-family: Arial;
}

h1
{
    font-size: 20px;
}

#PageWrapper
{
    width: 844px;
}

#MenuWrapper
{
    width: 844px;
}

#MainContent
{
    width: 664px;
    float: left;
}

#Sidebar
{
    background-color: Gray;
    width: 180px;
    float: left;
}

#Footer
{
    background-color: #C0C0C0;
    width: 844px;
    clear: both;
}

结果(侧边栏背景预计为灰色): enter image description here

我犯了什么错误,任何人都可以告诉我它在哪里吗?

1 个答案:

答案 0 :(得分:5)

“补充工具栏”!=“SideBar”

区分大小写