CSS border-top-right-radius Eigenschaft

Definition und Verwendung

Die border-top-right-radius-Eigenschaft definiert die Form der rechten unteren Ecken des Randes.

Tipp:Diese Eigenschaft ermöglicht es Ihnen, dem Element runde Ecken hinzuzufügen.

Siehe auch:

CSS3-Tutorial:CSS3 Ränder

Beispiel

Fügen Sie eine runde Ecke an die rechte obere Ecke des div-Elements hinzu:

div
{
border:2px solid;
border-top-right-radius:2em;
}

Probieren Sie es selbst aus

CSS-Syntax

border-top-right-radius: length|% [length|%];

Anmerkung:Die Längenwerte und Prozentwerte der border-top-right-radius-Eigenschaft definieren den Radius der Viertelkreise (define die Form der Ecken des äußeren Randes der Kante) der Ellipse (define die Form der Ecken des äußeren Randes). Der erste Wert ist der horizontale Radius, der zweite Wert ist der vertikale Radius. Wenn der zweite Wert weggelassen wird, wird der erste Wert kopiert. Wenn die Länge Null ist, ist die Ecke quadratisch, nicht rund. Der Prozentwert des horizontalen Radiuss wird auf die Breite des Randkästchens bezogen, und der Prozentwert des vertikalen Radiuss wird auf die Höhe des Randkästchens bezogen.

Eigenschaftswert

Wert Beschreibung Test
length Definiert die Form des rechten oberen Ecks. Test
% Definiert die Form des rechten oberen Ecks in Prozent. Test

Technische Details

Standardwert: 0
Vererbbarkeit: nein
Version: CSS3
JavaScript-Syntax: object.style.borderTopRightRadius="5px"

Browser-Unterstützung

Die in der Tabelle angegebenen Zahlen geben die erste Browser-Version an, die die Eigenschaft vollständig unterstützt.

Chrome IE / Edge Firefox Safari Opera
5.0
4.0 -webkit-		 9.0 4.0
3.0 -moz-		 5.0
3.1 -webkit-		 10.5