wake-up-neo.com

CSS: Hintergrundfarbe nur innerhalb des Rands

Ich habe nach einer Antwort gesucht, konnte sie aber nirgendwo finden. Meine Frage ist ziemlich einfach: Ich habe eine Hintergrundfarbe meines Körpers, dann einen großen Rand, und jetzt möchte ich eine andere Hintergrundfarbe innen der Rand.

Wie mache ich das mit CSS?

htmlcssmarginbackground-color
39
user1318194

Wenn Ihr Rand für den Körper festgelegt ist, sollte beim Festlegen der Hintergrundfarbe des HTML-Tags der Randbereich farbig sein

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

http://jsfiddle.net/m3zzb/

Oder legen Sie als Dmackerman-Vorschlag einen Rand von 0 fest, aber einen Rand der Größe, die der Rand sein soll, und legen Sie die Randfarbe fest

43
Erik Funkenbusch

Könnten Sie anstelle eines Randes einen Rand verwenden? Sie sollten dies trotzdem mit <div> tun.

Etwas wie das?enter image description here

http://jsfiddle.net/GBTHv/

14
dmackerman

Ich brauchte etwas Ähnliches und kam mit: vor (oder nach) Pseudoklassen:

#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
rlv-dan

Das ist beim Box Model nicht möglich. __ Sie können jedoch eine Problemumgehung mit dem Rahmenbild von css3 oder mit der Rahmenfarbe in css verwenden.

Sie sind sich jedoch nicht sicher, ob Sie möglicherweise ein Problem mit dem Zurücksetzen von ..__ haben. Einige Browser setzen auch einen Rand auf html. Siehe Eric Meyers Reset CSS für mehr!

html{margin:0;padding:0;}
0
worenga