如何只改变身体颜色?

我试图只改变我的身体颜色,我有一个div与我的内容,我希望我的身体,只有主div的外部是灰色的。 我试着改变我的身体背景颜色为灰色和div为白色:body {font-family:'Roboto',sans-serif;

background-color:#cccccc; }

div#content {display:block;

宽度:85%;

background-color:#FFF;

margin-left:auto;

margin-right:auto; }

但随后它变得灰暗。

我的代码:

<style type="text/css">
    *
    {
        box-sizing: border-box;

        margin: 0;
    }

    body
    {
        font-family: 'Roboto',sans-serif;

        background-color: #cccccc;
    }

    div#content
    {
        display: block;

        width: 85%;

        background-color: #FFF;

        margin-left: auto;

        margin-right: auto;
    }

    header
    {
        width: 100%;

        display: block;

        float: left;
    }

    article
    {
        float: left;

        width: 100%;

        margin-top: 50px;

        display: block;
    }

    header img
    {
        float: left;            

        width: 150px;

        height: 50px;
    }

    header ul
    {
        list-style: none;

        float: left;

        margin-top: 15px;
    }

    header ul li
    {
        display: inline-block;

        margin-right: 5px;

        transition: 0.5s;

        box-shadow: 1px 1px 1px rgba(0,0,0,0.5);

        text-transform: uppercase;

        background-color: #F9C319;

        font-size: 11pt;

        color: white;

        padding: 5px;
    }
    header ul li:hover
    {
        background-color: #1FC0EE;
    }

    section#principal
    {
        float: left;

        width: 100%;

        display: block;
    }

    section#secundaria
    {
        float: left;

        width: 100%;

        display: block;

        margin-top: 50px;

        margin-bottom: 10px;
    }

    section#principal img
    {
        float: left;

        width: 350px;

        height: 230px;

        box-shadow: 10px 11px 20px -4px rgba(0,0,0,0.75);

        margin-right: 25px;
    }

    section#principal p
    {
        text-align: justify;

        font-size: 14pt;
    }

    section#secundaria figure
    {
        width: 33.33%;

        float: left;

        text-align: center;
    }

    section#secundaria figure figcaption
    {
        margin-bottom: 15px;

        font-size: 12pt;
    }

    section#secundaria figure img
    {
        height: 200px;

        width: 280px;

        box-shadow: 10px 11px 20px -4px rgba(0,0,0,0.75);
    }

    section#secundaria figure p
    {
        text-align: justify;

        padding: 10px 50px 10px 50px;

        font-size: 12pt;
    }

    footer
    {
        width: 100%;

        padding:10px;

        float: left;

        display: block;

        border-top:1px solid #111111;
    }

    footer section
    {
        margin-left: 500px;

        display: block;
    }

    footer section img
    {
        width: 32px;
    }

    footer p
    {
        float: right;

        font-size: 10pt;
    }

</style>

这对我来说很好:

<style>
body {background-color:#ccc;}
div#content
{
 width:85%;
  height:500px;
  background-color:#fff;
  margin:auto;
 }
 </style>
 <body>
 <div id=content>
 </div>
 </body>

请注意,要查看任何效果,div必须具有指定的高度或其中的某个值,以便高度不为零。

如果高度为零,则白色将不会有任何东西成为背景FOR,并且页面将全部变灰。

此外,你没有包含你的HTML,所以也许缺少“id = content”。
那里的名字'内容'没有什么特别之处。

链接地址: http://www.djcxy.com/p/95645.html

上一篇: How to change only body color?

下一篇: android web font different