CSS: Hintergrundfarbe nur innerhalb des Randes

Suchte ich nach einer Antwort, aber konnte ihn nicht finden überall. Meine Frage ist relativ einfach: ich habe eine hintergrund Farbe von meinem Körper, dann eine große Spanne, und jetzt möchte ich eine andere Hintergrundfarbe innen die Marge.

Wie mache ich das mit CSS?

Kommentar zu dem Problem
Sie nur hintergrund innerhalb der Marge. Box-Modell: w3.org/TR/CSS2/box.html Kommentarautor: c69
wenn du ein padding anstelle von ein Rand, Sie haben dann die hintergrund-Farbe, die Sie wählten für das element Kommentarautor: bevacqua

InformationsquelleAutor der Frage | 2012-04-06

  1. 37

    Wenn Ihre Marge auf den Körper gesetzt, dann die Einstellung der Hintergrundfarbe der html-tag soll die Farbe der Randbereich

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

    http://jsfiddle.net/m3zzb/

    Oder als dmackerman Vorschläge, einen Rand von 0, aber eine Grenze der Größe, die Sie wollen, dass die Marge und setzen Sie die Eigenschaft ' border-color

    InformationsquelleAutor der Antwort Erik Funkenbusch

  2. 12

    Statt mit einer Marge, konnte verwenden Sie eine Grenze? Sie sollten dies tun, mit <div> sowieso.

    Sowas?CSS: Hintergrundfarbe nur innerhalb des Randes

    http://jsfiddle.net/GBTHv/

    InformationsquelleAutor der Antwort dmackerman

  3. 3

    Brauchte ich etwas ähnliches, und kam mit über die :vor (oder :nach) pseudoclasses:

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

    JSFiddle

    InformationsquelleAutor der Antwort rlv-dan

  4. 0

    Ist das nicht möglich du auf die Box-Modell.
    Allerdings könnte man eine Behelfslösung mit css3 - border-image, oder border-color im Allgemeinen css.

    Aber im nicht sicher sind, ob Sie möglicherweise ein problem mit dem zurücksetzen.
    Einige Browser einen Rand in html als auch. Siehe Eric Meyers CSS-Reset für mehr!

    html{margin:0;padding:0;}

    InformationsquelleAutor der Antwort worenga

Schreibe einen Kommentar