Question

很多时候在通过body标记创建完整背景时遇到了这个问题。如果body标记的背景为蓝色，则网站中的所有小div都会显示相同的颜色。即使主div背景也无效。在这种情况下，我特别要做所有div background-none。请告诉我是否有任何想法来解决这个问题。

<header><div class="inner">
        <div class="h-top"><div class="left blue-text">Traditional Print • Social Syndication • Embedded Video • Radio</div> <div class="right"> (800)355-9500 <img src="images/in.png" alt="" align="absmiddle" title="linkedin.com"  />  <img src="images/twitter.png" alt="" align="absmiddle" title="twitter.com"  /> <img src="images/facebook.png" align="absmiddle" alt="" title="facebook.com"  /> <img src="images/bloger.png" alt="" align="absmiddle" title="linkedin.com"  /></div></div>

        <div class="clear"></div>
        <div class="h-bottom"><div class="left"><img src="images/logo.png" alt="" title="" /></div>
        <nav class="right"> 
            <ul>          
                <li>Our Guarantee</li>
                <li> Our Difference  </li>
                <li>What We Do </li>
                <li> Our Clients </li>
                <li>Contact</li>
            </ul>
        </nav>
        </div><!--h-bottom-->

      </div><!--inner-header-->    
    </header>





*{

    margin:0;
    padding:0;
    text-decoration:none;
    font-style:normal;
    color:#011c2d;
    font-size:17px;
    background:#d2d2d2;
    font-family:'schoolbookregular';
}

.main{
    width:1082px;
    margin:0 auto;
    background:#f5f5f5;
}

.inner{
    margin:0 50px;
}

.left{
    float:left;
}

.right{
    float:right;
}

.h-top{
    padding:20px 0;
    display: inline-block;
    width: 100%;
}

.blue-text{
    color:#0067b0;
    font-size: 15px;
}

.h-bottom{
    margin: 20px 0;
    display: inline-block;
    width: 100%;
}

header{
    font-family:'schoolbookregular';
}

nav{
    margin:17px 0 0 0;
}

nav>ul{
    marigh:0;
    padding:0;
}

nav>ul>li{
    float:left;
    padding:7px 15px;
    margin-left:7px;
    color:#fff;
    background:#0067b0;
    list-style:none;
}

Answer 1

问题是默认情况下你的.main高度为0，所以你无法看到任何输出。尝试将高度更改为500px或您喜欢的某个值。

/*If you want a background color to body do it here, not on '*' */
body {
    min-height: 100%;
    background: #0000ff;
}

.main {
    /* other styles */
    min-height: 500px;
}

Answer 2

更好的解决方法是引入一个新的＆＃39; div＆＃39;在您的页面中标记没有内容。这会帮助你..！

Answer 3

如果要设置正文背景，请使用

明确指定

body {
    background: #d2d2d2;
}

你不应该设置*的背景，这通常会导致大量的覆盖，这是不好的。

身体背景颜色出现在整个网站div

3 个答案: