Цвет фона тела появляется во всех разделах сайта

0

Много раз сталкивались с этой проблемой при создании полного фона через тег 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;
}
  • 0
    Добавьте немного HTML. И в чем именно твоя проблема. Вот как работает CSS. Вы должны стилизовать div. Не могу помочь без вашего HTML.
Теги:

3 ответа

0
Лучший ответ

Если вы хотите установить фон тела, сделайте это явно с помощью

body {
    background: #d2d2d2;
}

Вы не должны устанавливать фон *, это обычно вызывает много перезаписи, что не очень приятно.

  • 0
    Greate !!! оно работает.
  • 0
    Но мы можем использовать * вместо тега body . Означает, что не так с *
Показать ещё 2 комментария
2

Проблема заключается в том, что ваша высота.main будет равна 0, поэтому вы не сможете увидеть какой-либо вывод. Попробуйте изменить высоту до 500 пикселей или какое-то значение, которое вы предпочитаете.

/*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;
}
  • 1
    Хорошая работа Шива, +1 для вас :)
0

Лучший способ решить - ввести новый тег "div" на вашей странице без содержимого. это поможет вам..!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню