border-bottom-right-radius

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.

Initialwert	`0`
Anwendbar auf	alle 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`.
Vererbt	Nein
Prozentwerte	bezieht sich auf die Größe der Border-Box
Medien	visuell
Berechneter Wert	zwei absolute `length` oder `percentage`
Animationstyp	Längenangabe, Prozentsatz oder `calc()`;
Kanonische Reihenfolge	die 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

Initialwert	`0`
Anwendbar auf	alle 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`.
Vererbt	Nein
Prozentwerte	bezieht sich auf die Größe der Border-Box
Medien	visuell
Berechneter Wert	zwei absolute `length` oder `percentage`
Animationstyp	Längenangabe, Prozentsatz oder `calc()`;
Kanonische Reihenfolge	die eindeutige Reihenfolge definiert durch die formale Grammatik

Browser Kompatibilität

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android Webview	Chrome für Android	Firefox für Android	Opera für Android	Safari auf iOS	Samsung Internet
`border-bottom-right-radius`	Chrome 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 9	Opera Vollständige Unterstützung 10.5 Vollständige Unterstützung 10.5 Vollständige Unterstützung 15 Mit Präfix Mit Präfix Benötigt das Herstellerpräfix: -webkit-	Safari 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 Vollständige Unterstützung ≤37 Vollständige Unterstützung ≤37 Vollständige Unterstützung ≤37 Mit Präfix Mit Präfix Benötigt das Herstellerpräfix: -webkit-	Chrome Android Vollständige Unterstützung 18 Vollständige Unterstützung 18 Vollständige Unterstützung 18 Mit Präfix Mit Präfix Benötigt das Herstellerpräfix: -webkit-	Firefox Android 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 4 — 14 Alternativer Name Alternativer Name Verwendet den nicht standardisierten Namen: `-moz-border-radius-bottomright`	Opera Android Vollständige Unterstützung 11 Vollständige Unterstützung 11 Vollständige Unterstützung 14 Mit Präfix Mit Präfix Benötigt das Herstellerpräfix: -webkit-	Safari iOS Vollständige Unterstützung 4.2 Vollständige Unterstützung 4.2 Vollständige Unterstützung 1 Mit Präfix Mit Präfix Benötigt das Herstellerpräfix: -webkit-	Samsung Internet Android Vollständige Unterstützung 1.0 Vollständige Unterstützung 1.0 Vollständige Unterstützung 1.0 Mit Präfix Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Elliptical corners	Chrome Vollständige Unterstützung 1	Edge Vollständige Unterstützung 12	Firefox Vollständige Unterstützung 3.5	IE Vollständige Unterstützung 9	Opera Vollständige Unterstützung 10.5	Safari Vollständige Unterstützung 3	WebView Android Vollständige Unterstützung ≤37	Chrome Android Vollständige Unterstützung 18	Firefox Android Vollständige Unterstützung 4	Opera Android Vollständige Unterstützung Ja	Safari iOS Vollständige Unterstützung 1	Samsung Internet Android Vollständige Unterstützung Ja
Percentages	Chrome Vollständige Unterstützung 4	Edge Vollständige Unterstützung 12	Firefox 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 9	Opera Vollständige Unterstützung 10.5	Safari Vollständige Unterstützung 5	WebView Android Vollständige Unterstützung ≤37	Chrome Android Vollständige Unterstützung 18	Firefox Android Vollständige Unterstützung 4	Opera Android Vollständige Unterstützung Ja	Safari iOS Vollständige Unterstützung 4.2	Samsung Internet Android Vollständige Unterstützung Ja

Legende

Vollständige Unterstützung: Vollständige Unterstützung
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.

Zuletzt verändert: Mar 23, 2019, von MDN-Mitwirkenden