Question

我一直用html和css编写一个网站，最近我需要一个带背景颜色的div元素。我输入了background-color: gray;，但那不起作用。我使用了谷歌浏览器的inspect元素功能，它说Chrome无法识别该元素。我在Firefox中使用了相同的功能，但它也无法识别css元素。 div包含三个浮动部分，但它使用overflow: auto，因此这不是问题。有人可以向我解释为什么我不能为我的div添加背景颜色吗？

HTML：

<div id="main">
        <header>
        <h1>LOGO</h1>
        <nav>
            <a href="index.html" title="Home">Home</a>
            <a href="about.html" title="About">About</a>
            <a href="features.html" title="Features">Features</a>
            <a href="specs.html" title="Specifications">Specs</a>
            <a href="updates.html" title="Updates">Updates</a>
            <a href="contact.html" title="Contact Us">Contact</a>
        </nav>
        </header>

        <section class="left">
        <h2>NEWS</h2>
        <p>Itate eaquid quodit, utem dolorenihit ullore ides est faccum simaiorrum accaerf erfercim voloremod ut volectem con cus, temoluptatur as disquatent.</p>
        </section>

        <section class="right">
        <h2>SOMETHING</h2>
        <p>Itate eaquid quodit, utem dolorenihit ullore ides est faccum simaiorrum accaerf erfercim voloremod ut volectem con cus, temoluptatur as disquatent.</p>
        </section>

        <section class="right">
        <h2>SOMETHING</h2>
        <p>Itate eaquid quodit, utem dolorenihit ullore ides est faccum
simaiorrum accaerf erfercim voloremod ut volectem con cus,
temoluptatur as disquatent.</p>
        </section>
    </div>

的CSS：

#main {
    backgound: gray;
    layer-background: gray;
    overflow: auto;
    border: 2px dashed black;

    border-radius: 15px;
    -moz-border-radius: 15px;
}

section {
    background-color: green;
    text-align: justify;
    margin: 5px;
    padding 10px;

    border-radius: 10px;
    -moz-border-radius: 10px;
}

Answer 1

在CSS的这一部分：

#main {
    backgound: gray;
    layer-background: gray;

    /* .. */
}

backgound应为background，layer-background不是CSS属性。

修正了这些错误，what you have works。

Answer 2

背景拼写错误。正确的拼写是背景，并尝试提供除使用颜色名称之外的十六进制代码。

div background-color不起作用

2 个答案: