Как установить цвет фона всей страницы в css

Я пытаюсь установить желтый цвет фона страницы на http://yumdom.com/.

Я пробовал следующее, и это не удается:

body{ background-color: yellow;} /*only a sliver under the header turns yellow.*/

#doc3{ background-color: yellow;} /*result same as above*/

#bd { background-color: yellow;} /*result same as above*/

#yui-main { background-color: yellow;} /*a rectangle turns yellow ending at where the content ends. I want this rectangle to extend all the way to the footer.*/

Также обратите внимание, что если в инструментах разработчика в Chrome я выделю один из указанных выше элементов html, я выделю только определенную часть страницы. Нижний колонтитул и раздел под содержимым остаются не выделенными.

Я хочу, чтобы желтый занимал все пространство между верхним и нижним колонтитулом и не оставлял пробелов.

Обратите внимание, что мы используем шаблоны CSS YUI Reset, Fonts и Grids V 2.8.0r4

Большое спасибо!

8 ответов

Решение

Я уже написал ответ на это, но, кажется, он был удален. Проблема заключалась в том, что YUI добавил background-color:white к элементу HTML. Я переписал это, и все было легко справиться с этим.

Размер тела является динамическим, он только такой же, как размер его содержимого. В файле CSS вы можете использовать:* {background-color: black} // Все элементы теперь имеют черный фон.

или же

html {background-color: black} // У страницы теперь черный фон, все элементы остаются прежними.

<html>
  <head>
    <title>
        webpage
      </title>
</head>
  <body style="background-color:blue;text-align:center">
    welcome to my page
    </body>
  </html>

Проблема в том, что тело страницы на самом деле не видно. DIV имеют ширину 100% и сами имеют фоновые цвета, которые перекрывают тело CSS.

Чтобы исправить ничейную землю, это может сработать. Это не элегантно, но работает.

#doc3 {
    margin: auto 10px;
    width: auto;
    height: 2000px;
    background-color: yellow;
}

Я проверил ваш исходный код и обнаружил, что для того, чтобы изменить его на желтый, вам нужно добавить желтый цвет фона: #left-padding, #right-padding, html, #hd, #main и #yui-main.

Надеюсь, это то, что вы хотели. До встречи

Вы должны применить его к тегу body.

Сокращение:

      body {
    background: black;
}

Отдельная недвижимость:

      body {
    background-color: black;
}

Вот html: как изменить цвет фона на YouTube.

В других ответах не упоминается, что существует четыре способа фактически указать / изменить CSS:

  1. Внешний CSS (с использованием <link> тег для добавления вашего CSS)
  2. Внутренний CSS (введите CSS между <style> теги)
  3. Встроенный CSS (введите style атрибут прямо внутри HTML-элемента.
  4. С помощью JavaScript: используйте document.querySelector("#id").style.backgroundColor = 'black' просто убедитесь, что набрали этот код между <script> теги

Похоже, мне нужно установить yellow на #doc3 а затем избавиться от white это вызвано на #yui-main (который покрывает цвет #doc3). Это делает вас желтым между верхним и нижним колонтитулом.

Вы используете селектор в CSS, я думаю, вы выбираете только компонент тела. Поэтому, если вы хотите, чтобы весь фон был одного цвета, вы должны выбрать правильный компонент. В HTML есть тело заголовка, тег заголовка определяет содержимое, отображаемое в теге. Тело определяет все тело вашего HTML. Выделенная часть — это заголовок и тело вашего HTML.

Другие вопросы по тегам