CSS Reference Manual

CSS @rules (RULES)

Complete List of CSS Properties

CSS Grenze-rechts Eigenschaft CSS Grenze-links-width Eigenschaft

CSS3 Grenze-Verwendung und Beispiel der Radius-Eigenschaft

Grenze-Die Radius-Eigenschaft setzt die Ecken eines Elements in runde Form. Es istGrenze-oberen-links-radius,Grenze-oberen-rechts-radius,Grenze-unten-rechts-radiusundGrenze-unten-links-radiusKurzschreibweise des Attributes.

In der folgenden Tabelle sind die Verwendungsanweisungen und Versionshistorie dieses Attributes sowie seine Verwendungssyntax in JavaScript-Skripten aufgeführt.

Standardwert:	0
Geeignet für:	Alle Elemente
Vererbung:	Keine
Animierbar:	Ja.Bitte参阅 Animationseigenschaften.
Version:	CSS3Neue Funktion
JavaScript-Syntax:	object object.style.borderRadius="8px"

Hinweis:Grenze-Radius macht auch dann den Hintergrund eines Elements rund, wenn keine Umrandung definiert ist oder der Wert auf none gesetzt wird.

Grenze-Syntax der Verwendung von Radius

Die Syntax dieses Attributes ist wie folgt:

Grenze-Radius: [Länge | Prozentsatz]　1　zu　4　Werte　
　\"-------------------------------/
　　　　　　　　　　　　Erste Radien
/　[Länge | Prozentsatz]　1　zu　4　Werte | initial | inherit
　　　\"------------------------------/
　　　　　　　　Zweite Radien (optional)

dieser Kurzwahl kann ein, zwei, drei oder vier durch Leerzeichen getrennte Werte haben.

wenn angegebenEin Wertwird, definiert den Radius aller Ecken.
wenn angegebenZwei Wertewird, wird der erste Wert für links oben und rechts unten verwendet, und der zweite Wert für rechts oben und links unten verwendet.
wenn angegebenDrei Wertewird, wird der erste Wert für links oben verwendet, der zweite Wert für rechts oben und links unten und der dritte Wert für rechts unten verwendet.
wenn angegebenVier Wertewird, wird jeder Wert in der Reihenfolge von links oben, rechts oben, rechts unten und links unten auf die Kante angewendet.

Der folgende Beispiel zeigt, wie man die Grenze verwendet-radius-Eigenschaft.

Beispiel

　　div　{
　　　Grenze:　2px　solide　#f08080;
　　　Grenze-radius:　20px;
　　}

Testen Sie es heraus‹/›

Hinweis:Optionale zweite Längenwert (beginnend mit „ /„ beginnend) definiert den vertikalen Radius der Ecken, daher hat die Ecke die Form eines Viertelellipses. Wenn die zweite Länge weggelassen wird oder gleich ist, hat die Ecke die Form eines Viertelkreises. Wenn einer der Längen null ist, ist die Ecke ein Quadrat und nicht ein abgerundetes Ecke.

Eigenschaftswerte

Die folgende Tabelle beschreibt die Werte dieser Eigenschaft.

Wert	Beschreibung
length	In Längenwerten wie px, pt, cm, em usw., sind negative Werte nicht erlaubt.
percentage	Die Größe des Radius in Prozent. Bei ovalen Ecken wird der horizontale Radius in Prozent相对于元素框的宽度 berechnet, und der vertikale Radius in Prozent相对于元素höhe berechnet. Negative Werte sind nicht erlaubt.
initial	Setzen Sie diesen Wert auf seinen Standardwert.
inherit	Wenn angegeben, wird das zugehörige Element die Grenze des Elternelements verwenden-radius-Eigenschaftswerte.

Browser-Kompatibilität

Grenze-Kompatibilität der radius-Eigenschaft der Browser, die Zahlen in der folgenden Tabelle stellen die niedrigste Versionsnummer dar, die die Eigenschaft unterstützt; alle gängigen Browser unterstützen diese Eigenschaft.

	Firefox 4+ Google Chrome4+ Internet Explorer 9+ Apple Safari 5+ Opera 10.5+

Warnung: Internet Explorer 8und frühere Versionen wird diese Grenze nicht unterstützt-radius-Eigenschaft. In IE9und höheren Versionen unterstützt.

Weitere Lesung

Siehe Anleitung:CSS Grenze,CSS3 Grenze.

CSS Grenze-rechts Eigenschaft CSS Grenze-links-width Eigenschaft