Warum ist mein Rand nicht rot? Fehlerbehebung bei CSS-Randproblemen

Fehlerbehebung bei der Rahmenfarbe: Warum sie nicht rot ist

Beim Hinzufügen eines Rahmens zu einem Element kommt es häufig vor, dass die angegebene Farbe nicht stimmt wird nicht angewendet. So lösen Sie dieses Problem mit CSS:

Bedenken Sie den folgenden Codeausschnitt:

<div>

Wie in diesem JSFiddle gezeigt (http://jsfiddle.net/zeburrehman/aFzKy/151/ ) bleibt der Rahmen um das DIV-Element unsichtbar, auch wenn die Randfarbe als angegeben ist rot.

Verstehen des Problems

Standardmäßig setzt der Browser sowohl die Rahmenbreite als auch den Rahmenstil auf Null bzw. „keine“. Das bedeutet, dass zwar eine Rahmenfarbe definiert ist, es aber keinen sichtbaren Rahmen gibt, auf dem sie angezeigt werden kann.

Lösung

Um den Rand sichtbar zu machen und die gewünschte Farbe anzuwenden, müssen Sie müssen die Eigenschaften border-width und border-style explizit festlegen. Die Randbreite bestimmt die Dicke des Randes, während der Randstil sein Erscheinungsbild bestimmt (z. B. durchgezogen, gestrichelt).

Der effizienteste Weg, dies zu erreichen, besteht darin, alle drei Randeigenschaften in einer einzigen zu kombinieren Deklaration:

#box {
    border: 1px solid red;
}

Indem Sie die Rahmenbreite auf 1 Pixel und den Rahmenstil auf fest setzen, definieren Sie einen 1 Pixel breiten festen Rahmen um das Element und geben an seine Farbe ist rot. Diese komprimierte Notation fasst der Einfachheit halber die drei einzelnen Randeigenschaften in einer Zeile zusammen.

Das obige ist der detaillierte Inhalt vonWarum ist mein Rand nicht rot? Fehlerbehebung bei CSS-Randproblemen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!