Style borderTopLeftRadius Property

Definition and Usage

borderTopLeftRadius Sets or returns the shape of the top left border corner of the property.

Tip:This property allows you to add rounded border corners to the element!

See Also:

CSS Reference Manual:border-top-left-radius Property

Example

Add rounded border corners to the top left corner of the div element:

document.getElementById("myDIV").style.borderTopLeftRadius = "25px";

Try It Yourself

Syntax

Return borderTopLeftRadius Property:

object.style.borderTopLeftRadius

Set borderTopLeftRadius Property:

object.style.borderTopLeftRadius = "length|% [length|%]|initial|inherit"

Note:The length value and percentage value of the border-top-left-radius property define the radius of a quarter ellipse (defining the shape of the corner of the external border edge). The first value is the horizontal radius, and the second value is the vertical radius. If the second value is omitted, the first value is copied. If the length is zero, the corner is square, not round. The percentage value of the horizontal radius refers to the width of the border box, and the percentage value of the vertical radius refers to the height of the border box.

Property Value

Value Description
length Define the shape of the top left corner.
% Define the shape of the bottom left corner with percentage values.
initial Sets this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

Technical Details

Default Value: 0
Return Value: A string representing the element's border-top-left-radius Property.
CSS Version: CSS3

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support 9.0 Support Support Support