Question

我的问题涵盖了所有我无法弄清楚为什么我的部分div不使用我设置的颜色（白色）。我在我的CSS中设置它，由于某种原因它没有正确应用。非常感谢所有帮助

body {
        width: 100%;
        background: #444444;
    }
    /*Header styles*/
    header {
        width: 100%;
        height: 77px;
        background: #ffffff;
    }
    header #logo {
        background: #444444;
        display: inline-block;
        width: 150px;
        margin-left: 60px;
        float: left;
    }
    header nav {
        width: 40%;
        height: 100%;
        vertical-align: middle;
        float: right;
        margin-right: 60px;
    }
    header nav ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }
    header nav li {
        height: 100%;
        line-height: 77px;
        display: inline-block;
        margin-left: 55px;
    }
    header nav a {
        color: #000000;
        text-decoration: none;
        text-transform: uppercase;
    }
    /*Homepage Styles*/
    #homepage {
        width: 100%;
        background: #444444;
    }
    #homepage #banner-h {
        margin-top: 56px;
        height: 751px;
        background: #ffffff;
    }
    #homepage #banner-h #bht {
        height: 88px;
        margin: auto;
        color: #000000;
    }
    #aboutme {
        height: 2400px;
    }
    .aboutsection {
        height: 593 px;
        border: 1px solid black;
        background: #ffffff;
    }
    footer {
        margin-top: 56px;
        background: #ffffff;
        width: 100%;
        height: 166px;
    }
    footer #fom {
        height: 90%;
        text-align: center;
        display: table;
        width: 100%;
    }
    footer h1 {
        display: table-cell;
        vertical-align: middle;
    }
    /*# sourceMappingURL=style.css.map */

    <!DOCTYPE html>
      <head lang="en">
        <meta charset="UTF-8">
        <link rel="stylesheet" href="css/style.css"/>
        <link rel="stylesheet" href="css/normalize.css"/>
        <title></title>
      </head>
      <body>
        <header>
          <div id="logo">
            <img src="img/logo/caseywoelfle.com.svg" width="150px" height="77">
          </div>
          <nav>
            <ul>
              <li><a href="index.html">home</a></li>
              <li><a href="aboutme.html">about me</a></li>
              <li><a href="portfolio.html">portfolio</a></li>
              <li><a href="blog.html">blog</a></li>
              <li><a href="contact.html">contact</a></li>
            </ul>
          </nav>
        </header>
        <div id="aboutme">
          <div class="aboutsecton"><p>Test</p></div>
          <div class="aboutsecton"><p>Test</p></div>
          <div class="aboutsecton"><p>Test</p></div>
          <div class="aboutsecton"><p>Test</p></div>
        </div>
        <footer>
          <span id="fom">
            <h1>find out more about me</h1>
          </span>
        </footer>
      </body>
    </html>

Answer 1

归结为一个简单的拼写错误。您在CSS选择器中使用.aboutsection，但您的div的类为aboutsecton，缺少i。

而不是：

<div class="aboutsecion"><p>Test</p></div>

......应该是：

<div class="aboutsection"><p>Test</p></div>

p / s：此外，由于高度声明中有额外的空格，因此高度声明无效。它应该是593px而不是593 px。

Answer 2

你错误拼写的部分：

<div class="aboutsecton">

应该是

<div class="aboutsection">

Answer 3

你拼错了部分。你在HTML中拼写了关于secton的内容。

<div class="aboutsecton"><p>Test</p></div>

应该是

<div class="aboutsection"><p>Test</p></div>

祝你好运！

为什么我的div没有我们的aboutme页面所需的背景颜色

3 个答案: