即使我遵循指示,颜色也不会显示

时间:2018-05-17 02:01:55

标签: html css

<html lang= "en">
  <head>
        <title>Murfreesboro Regional Soccer League</title>

        <meta charset="utf-8">
        <script src="mondernizr.custom.62074.js"></script>
        <meta name="viewport" content="width=device-width">
        <link rel="stylesheet" href="styles.css">

  </head>
  <body>
  <header>
    <h1>Murfreesboro Regional Soccer League</h1>
  </header>
        <p>Part of the North American Recreational soccer Association.</p>



        <footer>
                    <div>
                        <p id="contact">MRSL -c/o Davies Sporting Goods.
                    </div>
                    <div>
                        <p id="contact"> 418 N Sartoris St. - Murfreesboro, TN 37130 - (615) 555-2255</p>
                    </div>
        </footer>
  </body>

这是我的style.css

body   

                h1, {
                    background-color: orangered;
                    color:black;
                }
                #contact,{
                    background-color: green;
                    color: white;


                }

我还在主代码中添加了“”,但它没有显示出来。 我试图在这里和那里调整一些东西,但是当我去我的项目时。 一切都是黑白分明。

1 个答案:

答案 0 :(得分:1)

您的CSS无效。只需删除h1后的逗号和#contact

后的逗号

此外,ID应该是唯一的,因此您应该使用类而不是段落的ID。

&#13;
&#13;
h1 {
  background-color: orangered;
  color:black;
}
.contact {
  background-color: green;
   color: white;
}
&#13;
<html lang="en">

<head>
    <title>Murfreesboro Regional Soccer League</title>

    <meta charset="utf-8">
    <script src="mondernizr.custom.62074.js"></script>
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="styles.css">

</head>

<body>
    <header>
        <h1>Murfreesboro Regional Soccer League</h1>
    </header>
    <p>Part of the North American Recreational soccer Association.</p>

    <footer>
        <div>
            <p class="contact">MRSL -c/o Davies Sporting Goods.
        </div>
        <div>
            <p class="contact"> 418 N Sartoris St. - Murfreesboro, TN 37130 - (615) 555-2255</p>
        </div>
    </footer>
</body>
&#13;
&#13;
&#13;