CSS-Rahmen sind wesentliche Elemente auf Websites und stellen die Kanten verschiedener Komponenten und Elemente dar. CSS-Ränder beziehen sich auf die Linien, die Elemente umgeben und deren Kanten definieren. Rahmen können mithilfe von CSS-Eigenschaften wie Rahmenstil, Rahmenfarbe, Rahmenbreite und Rahmenradius gestaltet, gefärbt und in der Größe angepasst werden. Ränder können mit dem oberen Rand, dem rechten Rand, dem unteren Rand und dem linken Rand gestaltet werden.

In diesem Artikel „Rahmen in CSS“ erfahren Sie mehr über CSS-Rahmen, Stiloptionen, praktische Anwendungsfälle und Best Practices.

Inhaltsverzeichnis

• Randeigenschaften
• Möglichkeiten, Rahmen in CSS zu formatieren
• Gemeinsame Rahmenstile
• Beispiele für CSS-Rahmenstile
• Praktische Anwendungsfälle
• Anwendungsfälle für CSS-Ränder

Randeigenschaften

CSS bietet mehrere Eigenschaften zum Anpassen von Rändern:

1. Border-Stil : Bestimmt die Art des Rahmens (z. B. durchgezogen, gestrichelt, gepunktet).
2. Rahmenbreite : Legt die Breite des Rahmens fest (in Pixel, Punkten oder anderen Einheiten).
3. Randfarbe : Gibt die Rahmenfarbe an.
4. Grenzradius : Erstellt abgerundete Ecken für Elemente.

Möglichkeiten, Rahmen in CSS zu formatieren

Der CSS-Rahmeneigenschaft ermöglicht die Gestaltung des Rahmens eines Elements durch Festlegen von Breite, Stil und Farbe und ermöglicht so anpassbare visuelle Grenzen im Webdesign.

1. Rahmenstil

• CSS-Eigenschaft „Border-Top-Stil“.
• border-right-style-Eigenschaft
• border-bottom-style-Eigenschaft
• border-left-style-Eigenschaft

2. Randbreite

• border-top-width-Eigenschaft
• border-right-width-Eigenschaft
• border-bottom-width-Eigenschaft
• border-left-width-Eigenschaft

3. Rahmenfarbe

• border-top-color-Eigenschaft
• border-right-color-Eigenschaft
• border-bottom-color-Eigenschaft
• border-left-color-Eigenschaft

4. Einzelne Seiten umranden

5. Eigenschaft „Grenzradius“.

Gemeinsame Rahmenstile

Die Eigenschaft border-style gibt den Typ des Rahmens an. Keine der anderen Rahmeneigenschaften funktioniert ohne Festlegung des Rahmenstils.

Im Folgenden sind die Arten von Grenzen aufgeführt:

• Gepunktet : Erstellt eine Reihe von Punkten.
• Gestrichelt : Bildet eine gestrichelte Linie.
• Solide : Erzeugt eine durchgehende Linie.
• Doppelt : Rendert zwei parallele Linien.
• Rille Und Grat : Erstellen Sie 3D-Rillen- und Rilleneffekte.
• Einsatz Und Anfang : 3D-Ein- und Ausgangsränder hinzufügen.
• Keiner : Entfernt den Rand.
• Versteckt : Blendet den Rand aus.

Beispiele des CSS-Rahmenstils

In diesem Beispiel verwenden wir die CSS-Eigenschaft border-style.

Java-String-Teilzeichenfolge