CSS/Eigenschaften/äußere Gestaltung/Rahmen

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Inhaltsverzeichnis

Mit den border-…-Eigenschaften können Sie auf vielfältige Weise Rahmen definieren.

Empfehlung: zum besseren Verständnis wird das Studium des Artikels zum Box-Modell empfohlen

Für alle Elemente können folgende Eigenschaften Anwendung finden:

  • border-top als zusammenfassende Eigenschaft von
    • border-top-width, border-top-style, border-top-color
  • border-right als zusammenfassende Eigenschaft von
    • border-right-width, border-right-style, border-right-color
  • border-bottom als zusammenfassende Eigenschaft von
    • border-bottom-width, border-bottom-style, border-bottom-color
  • border-left als zusammenfassende Eigenschaft von
    • border-left-width, border-left-style, border-left-color
  • border-width als zusammenfassende Eigenschaft von
    • border-top-width, border-right-width, border-bottom-width, border-left-width
  • border-style als zusammenfassende Eigenschaft von
    • border-top-style, border-right-style, border-bottom-style,border-left-style
  • border-color als zusammenfassende Eigenschaft von
    • border-top-color, border-right-color, border-bottom-color, border-left-color
  • border-radius als zusammenfassende Eigenschaft von
    • border-top-right-radius, border-bottom-right-radius, border-bottom-left-radius, border-top-left-radius
  • border-image als zusammenfassende Eigenschaft von
    • border-image-source
    • border-image-slice
    • border-image-width
    • border-image-outset
    • border-image-repeat

Für Rahmen von Tabellenzellen können zudem folgende Eigenschaften Verwendung finden:

[Bearbeiten] Allgemeines

Sinnvoll sind die hier beschriebenen Angaben für border besonders für HTML-Elemente, die einen eigenen Absatz erzeugen bzw. einen Block bilden, also etwa für h[1-6], p, blockquote, address, pre sowie div oder table. Anwendbar sind sie aber auf alle Elemente. So ist es beispielsweise möglich, in HTML eine Tabelle zu notieren, in der einzelne Zellen verschiedene Rahmen nach Wunsch erhalten - nämlich mit Hilfe von CSS-Rahmeneigenschaften. Auch auf html und body lassen sich die hier aufgelisteten Eigenschaften anwenden - in diesem Fall wird um den gesamten sichtbaren Körper einer HTML-Datei ein Rahmen gezeichnet.

Wenn Sie bei Rahmendefinitionen nichts weiter angeben, kann es sein, dass die Inhalte von Elementen sehr nah an dem sie umgebenden Rahmen kleben. Zu diesem Zweck können Sie Innenabstände definieren. Dadurch schaffen Sie einen Abstand zwischen dem Rahmen und seinem Inhalt.

In der Regel werden Sie mehrere Angaben zu Rahmen kombinieren. So ist es sinnvoll, nicht nur eine Rahmendicke anzugeben, sondern auch die gewünschte Rahmenfarbe. Auch verschiedene Rahmentypen stehen zur Auswahl. Alle Rahmeneigenschaften können Sie wahlweise auf alle vier Seiten eines Elements anwenden, aber auch nur auf eine oder mehrere bestimmte Seiten.

[Bearbeiten] Siehe auch

Außenlinie (outline-…)

Meine Werkzeuge
Namensräume

Varianten
Aktionen
Übersicht
Schnell‑Index
Mitmachen
Werkzeuge
Spenden
SELFHTML