Referenz:CSS/Eigenschaften/border-image-slice

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
Eigenschaft border-image-slice CSS 3.0
Beschreibung zerlegt ein Hintergrundbild für den Rahmen in Einzelteile
erlaubte Werte

einer bis vier Werte. Dabei gelten folgende Regeln:

  • Eine Angabe: für alle 4 Schnitte gilt derselbe Abstand
  • Zwei Angaben: 1. Wert Abstand von oben und unten, 2. Wert Abstand von links und rechts
  • Drei Angaben: 1. Wert Abstand von oben, 2. Wert Abstand für links und rechts, 3. Wert Abstand von unten
  • Vier Angaben: 1. Wert Abstand von oben, 2. Wert Abstand von rechts, 3. Wert Abstand von unten, 4. Wert Abstand von links.
default-Wert

siehe Einzeleigenschaften

anwendbar auf alle Elemente (Unterschied Tag Element Attribut)
Vererbung nein
animierbar ja
Browsersupport
  • Chrome
  • Firefox
  • IE 11
  • Opera
  • Safari
Spezifikation W3c logo klein.gif Image Slicing: the ‘border-image-slice’ property
Beispiel
div { border-image: url(Border-image.png) 99 102;}
  • geladen wird das Bild: Border-image.png
  • abgeschnitten wird jeweils bei 99 Pixeln ab der Ober- und Unterkante, und bei 102 Pixeln ab der rechten und linken Kante
Beachten Sie
Tipp

Um den Elementen thead, tbody, tfoot oder tr einen sichtbaren Rahmen zuzuweisen, müssen die Rahmen innerhalb der Tabelle zusammenfallen (d.h. table {border-collapse: collapse;})