Eine kurze Analyse der CSS-Rahmeneigenschaften: Breite, Stil, Rahmen usw.

Dieser Artikel stellt Ihnen eine kurze Analyse der CSS-Rahmeneigenschaften vor: Breite, Stil, Rahmen usw. Er hat einen gewissen Referenzwert. Ich hoffe, er wird Ihnen hilfreich sein.

Definition und Verwendung

Eine oder mehrere Zeilen, die den Inhalt und die Auffüllung eines Elements umgeben.

Grundlegende Attribute: Breite, Stil, Farbe

width border-width

• border- Die Abkürzungseigenschaft width legt die Breite für alle Ränder des Elements oder für jeden Rand einzeln fest. Der

• -Wert kann eine angegebene Länge sein, z. B. 1 Pixel, oder eines der drei Schlüsselwörter: thin, medium, thick, die dünn bzw. mittel sind ( Standard) und fett.

• Funktioniert nur, wenn der Rahmenstil nicht „Keine“ ist. Wenn der Rahmenstil „None“ ist, wird die Rahmenbreite tatsächlich auf 0 zurückgesetzt. Negative Längenwerte sind nicht zulässig.

• Die Einstellungsreihenfolge der Ränder ist oben-rechts-unten-links. Sie können sie abkürzen, wenn Sie die Reihenfolge kennen.

Style Die Eigenschaft border-style

border-style wird verwendet, um den Stil des Elementrahmens festzulegen.

值	描述
none	定义无边框。
hidden	与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。

• Der Standardwert ist none. Wenn Sie also möchten, dass der Rahmen angezeigt wird, müssen Sie einen Stil deklarieren.

• Sie können mehrere Stile für einen Rahmen definieren.

• Der Rahmen wird möglicherweise nur angezeigt, wenn dieser Wert nicht „none“ ist.

Farbe Die Eigenschaft border-color

border-color wird verwendet, um die Farbe des Elementrahmens festzulegen.

• Die Standardrahmenfarbe ist die Vordergrundfarbe des Elements selbst. Wenn für den Rahmen keine Farbe deklariert ist, entspricht diese der Textfarbe des Elements. Wenn das Element hingegen keinen Text enthält, sagen wir, es handelt sich um eine Tabelle, die nur Bilder enthält, dann ist die Rahmenfarbe der Tabelle die Textfarbe des übergeordneten Elements (da die Farbe vererbt wird). Dieses übergeordnete Element ist höchstwahrscheinlich body, p oder eine andere Tabelle.

• Der Rand kann mit dem Wert transparent auf transparent gesetzt werden. Dieser Wert wird verwendet, um einen unsichtbaren Rahmen mit Breite zu erstellen.

Rand und Hintergrund

Der Rand wird über dem Hintergrund des Elements platziert.

Abgerundete Ecken umranden

Der Effekt abgerundeter Ecken um das Element ist eine häufig benötigte Funktion, und das Attribut border-radius kann abgerundete Ecken festlegen.

• Versionen vor ie9 sind nicht mit dem Attribut „abgerundete Ecken“ kompatibel.

• Der Wert ist die angegebene Länge, z. B. 4 Pixel.

Erweiterte Attribute

border-image border-image

Ähnliche Artikelempfehlungen:

Was sind die Formatierungskontexttypen (FC) im CSS-Layout? Einführung in Formatierungskontexttypen (FC)

Zwei Möglichkeiten zur Einführung des CSS-Rasterlayouts (Grid) (mit Code)

Das obige ist der detaillierte Inhalt vonEine kurze Analyse der CSS-Rahmeneigenschaften: Breite, Stil, Rahmen usw.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!