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:
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!
