HTML | DOM Style borderLeft Property
The DOM style borderLeft property is used to set or returns the three different border-left property such as border-left-width, border-left-style and border-left-color of an element.
Syntax:
- It is used to return the borderLeft Property.
object.style.borderLeft
- It is used to set the borderLeft property.
object.style.borderLeft = "width style color|initial|inherit"
Property value:
- width: This will set the width of left border.
- style: This will set the style of left border.
- color: This will set the color of left border.
- initial: This will set the property to it’s default value.
- inherit: This will inherit the property from it’s parent element
Return Value: It returns a string value which represents the width, style and/or color of the left border of an element.
Example 1:
html
<!DOCTYPE html> < html > < head > < title > DOM Style borderLeft Property </ title > </ head > < body > < center > < h1 style = "color:green;width:50%;" id = "sudo"> GeeksForGeeks </ h1 > < h2 >DOM Style borderLeft Property </ h2 >< br > < button type = "button" onclick = "geeks()"> Submit </ button > < script > function geeks() { document.getElementById("sudo").style.borderLeft = "thick solid green"; } </ script > </ center > </ body > </ html > |
Output:
Before Click on the button:
After Click on the button:
Example 2:
html
<!DOCTYPE html> < html > < head > < title > DOM Style borderLeft Property </ title > </ head > < body > < center > < h1 style = "color:green;"> GeeksForGeeks </ h1 > < h2 >DOM Style borderLeft Property </ h2 > < h3 style = "border:2px solid red;width:50%;" id = "sudo">geksforgeeks</ h3 > < br > < button type = "button" onclick = "geeks()"> Submit </ button > < script > function geeks() { document.getElementById("sudo").style.borderLeft = "thick dotted green"; } </ script > </ center > </ body > </ html > |
Output:
Before Click on the button:
After Click on the button:
Supported Browsers: The browser supported by DOM borderLeft Property are listed below:
- Google Chrome 1
- Edge 12
- Internet Explorer 4
- Firefox 1
- Opera 3.5
- Apple Safari 1