border-bottom-right-radius

Springen zu:
  1. Syntax
  2. Spezifikation
  3. Browser Kompatibilität

Die CSS Eigenschaft border-bottom-right-radius legt die Abrundung der unteren rechten Ecke eines Elements fest. Vor Gecko 2.0 (Firefox 4) war diese Eigenschaft unter dem Namen -moz-border-radius-bottomright bekannt.

Weitere Informationen sind unter border-top-left-radius verfügbar.

Initialwert0
Anwendbar aufalle Elemente; aber User Agents sind nicht gezwungen dies auf table und inline-table Elemente anzuwenden, falls border-collapse collapse ist. Das Verhalten bei internen Tabellenelementen ist momentan undefiniert.. Auch anwendbar auf ::first-letter.
VererbtNein
Prozentwertebezieht sich auf die Größe der Border-Box
Medienvisuell
Berechneter Wertzwei absolute length oder percentage
AnimationstypLängenangabe, Prozentsatz oder calc();
Kanonische Reihenfolgedie eindeutige Reihenfolge definiert durch die formale Grammatik

Syntax

border-bottom-right-radius: radius               /* the corner is a circle    */  E.g. border-bottom-right-radius: 3px
border-bottom-right-radius: horizontal vertical  /* the corner is an ellipsis */  E.g. border-bottom-right-radius: 0.5em 1em

border-bottom-right-radius: inherit

Formale Syntax

<length-percentage>{1,2}
wobei 
<length-percentage> = <length> | <percentage>

Spezifikation

Spezifikation Status Kommentar
CSS Backgrounds and Borders Module Level 3
Die Definition von 'border-bottom-right-radius' in dieser Spezifikation.		 Anwärter Empfehlung Initial definition

Initialwert0
Anwendbar aufalle Elemente; aber User Agents sind nicht gezwungen dies auf table und inline-table Elemente anzuwenden, falls border-collapse collapse ist. Das Verhalten bei internen Tabellenelementen ist momentan undefiniert.. Auch anwendbar auf ::first-letter.
VererbtNein
Prozentwertebezieht sich auf die Größe der Border-Box
Medienvisuell
Berechneter Wertzwei absolute length oder percentage
AnimationstypLängenangabe, Prozentsatz oder calc();
Kanonische Reihenfolgedie eindeutige Reihenfolge definiert durch die formale Grammatik

Browser Kompatibilität

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidEdge MobileFirefox für AndroidOpera für AndroidiOS SafariSamsung Internet
Grundlegende UnterstützungChrome Vollständige Unterstützung 4
Vollständige Unterstützung 4
Vollständige Unterstützung 1
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Edge Vollständige Unterstützung 12
Vollständige Unterstützung 12
Vollständige Unterstützung 12
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Firefox Vollständige Unterstützung 4
Hinweise
Vollständige Unterstützung 4
Hinweise
Hinweise Prior to Firefox 50, border styles of rounded corners were always rendered as if border-style was solid. This has been fixed in Firefox 50.
Vollständige Unterstützung 49
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Vollständige Unterstützung 44
Mit Präfix Deaktiviert
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Deaktiviert From version 44: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Keine Unterstützung 1 — 12
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: -moz-border-radius-bottomright
IE Vollständige Unterstützung 9Opera Vollständige Unterstützung 10.5Safari Vollständige Unterstützung 5
Vollständige Unterstützung 5
Vollständige Unterstützung 3
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
WebView Android ? Chrome Android ? Edge Mobile Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Firefox Android Vollständige Unterstützung Ja
Hinweise
Vollständige Unterstützung Ja
Hinweise
Hinweise Prior to Firefox 50, border styles of rounded corners were always rendered as if border-style was solid. This has been fixed in Firefox 50.
Opera Android ? Safari iOS ? Samsung Internet Android ?
PercentagesChrome Vollständige Unterstützung 4Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 4
Vollständige Unterstützung 4
Vollständige Unterstützung 1
Hinweise
Hinweise Before Firefox 4, the <percentage> was relative to the width of the box even when specifying the radius for a height. This implied that -moz-border-radius-bottomright was always drawing an arc of circle, and never an ellipse, when followed by a single value.
IE Vollständige Unterstützung 9Opera Vollständige Unterstützung 10.5Safari Vollständige Unterstützung 5WebView Android ? Chrome Android ? Edge Mobile Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung JaOpera Android ? Safari iOS ? Samsung Internet Android ?
Ellipitcal cornersChrome Vollständige Unterstützung 1Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 3.5IE Vollständige Unterstützung 9Opera Vollständige Unterstützung 10.5Safari Vollständige Unterstützung 3WebView Android ? Chrome Android ? Edge Mobile Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung JaOpera Android ? Safari iOS ? Samsung Internet Android ?

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Kompatibilität unbekannt  
Kompatibilität unbekannt
Siehe Implementierungshinweise.
Siehe Implementierungshinweise.
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.
Verwendet einen nicht standardisierten Namen.
Verwendet einen nicht standardisierten Namen.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.

Schlagwörter des Dokuments und Mitwirkende

Schlagwörter: 
Mitwirkende an dieser Seite: SJW, Sebastianz, fscholz, Yuichiro, Jürgen Jeka, Michael2402
Zuletzt aktualisiert von: SJW,