CSS border-top-left-radius Eigenschaft

Definition und Verwendung

Die border-top-left-radius-Eigenschaft definiert die Form der oberen linken Ecke des Randes.

Tipp:Diese Eigenschaft ermöglicht es Ihnen, Elementen abgerundete Ränder hinzuzufügen.

Siehe auch:

CSS3-Tutorial:CSS3 Ränder

Beispiel

Fügen Sie einen abgerundeten Rand an die linke obere Ecke des div-Elements hinzu:

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

Versuchen Sie es selbst

CSS-Syntax

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

Anmerkung:Die Längenwerte und Prozentsätze der border-top-left-radius-Eigenschaft definieren den Radius der Viertelellipse (define die Form der Kanten des äußeren Randes der Ecke). 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 anstatt rund. Der prozentuale Wert des horizontalen Radiusses bezieht sich auf die Breite des Randkastens, und der prozentuale Wert des vertikalen Radiusses bezieht sich auf die Höhe des Randkastens.

Eigenschaftswert

Wert Beschreibung Test
length Die Form des linken unteren Ecks wird definiert. Test
% Die Form des linken unteren Ecks wird durch einen Prozentsatz definiert. Test

Technische Details

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

Browser-Unterstützung

Die Zahlen in der Tabelle weisen auf die erste Browserversion hin, die diese 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