Styl border Vlastnost poloměru
Příklad
Přidejte k prvku div zaoblené okraje:
document.getElementById("myDIV").style.borderRadius = "25px";
Definice a použití
Vlastnost borderRadius je zkrácená vlastnost pro nastavení nebo vrácení čtyř vlastností borderRadius.
Čtyři vlastnosti hraničního poloměru jsou (v tomto pořadí):
borderTopLeftRadius
borderTopRightRadius
borderBottomRadiusRadius
borderDoleLeftRadius
Tip: Tato vlastnost umožňuje přidat k prvkům zaoblené rohy!
Podpora prohlížeče
Property | |||||
---|---|---|---|---|---|
borderRadius | Yes | 9.0 | Yes | Yes | Yes |
Syntax
Vraťte vlastnost borderRadius:
object.style.borderRadius
Nastavte vlastnost borderRadius:
object.style.borderRadius = "1-4 length|% / 1-4 length|%|initial|inherit"
Poznámka: Čtyři hodnoty pro každý poloměr jsou uvedeny v pořadí vlevo nahoře, vpravo nahoře, vpravo dole, vlevo dole. Pokud je vynechán levý dolní, je to stejné jako vpravo nahoře. Pokud je vynecháno pravé dolní, je to stejné jako vlevo nahoře. Pokud je vynechán pravý horní, je to stejné jako vlevo nahoře.
Hodnoty vlastností
Value | Description |
---|---|
length | Defines the shape of the corners. Default value is 0 |
% | Defines the shape of the corners in % |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Technické údaje
Výchozí hodnota: | 0 |
---|---|
Návratová hodnota: | Řetězec představující vlastnost border-radius prvku |
Verze CSS | CSS3 |
Související stránky
CSS reference: vlastnost border-radius