CSS: фоновый цвет только внутри поля

Я искал ответ, но не мог найти его нигде. Мой вопрос достаточно прост: у меня цвет фона моего тела, затем большой запас, и теперь мне нужен другой цвет фона внутри поля.

Как мне это сделать с помощью CSS?

Ответ 1

Если ваша маржа установлена на теле, то установка цвета фона тега html должна окрашивать область поля

html { background-color: black; }
body { margin:50px; background-color: white; }

http://jsfiddle.net/m3zzb/

Или, как предложения dmackerman, установите маркер 0, но границу размера, в котором вы хотите, чтобы была граница, и установите границу цвета

Ответ 2

Вместо того, чтобы использовать маржу, вы могли бы использовать границу? Так или иначе, вы должны сделать это с помощью <div>.

Что-то вроде этого?

http://jsfiddle.net/GBTHv/

Ответ 3

Мне было нужно что-то подобное, и придумал использование псевдоклассов: before (или: after):

#mydiv {
   background-color: #fbb;
   margin-top: 100px;
   position: relative;
}
#mydiv:before {
   content: "";
   background-color: #bfb;
   top: -100px;
   height: 100px;
   width: 100%;
   position: absolute;
}

JSFiddle

Ответ 4

Это невозможно для модели Box. Однако вы можете использовать обходной путь с css3 border-image или border-color в общем css.

Однако я уверен, что у вас может быть проблема с сбросом. Некоторые браузеры также устанавливают маржу для html. См. Eric Meyers Сброс CSS для большего!

html{margin:0;padding:0;}