HTML | DOM HR size Property
The DOM HR size property is used to set or return the value of the size attribute of the <hr> element.
Note : This property is not supported by HTML5
Syntax:
- It returns the HR size property.
hrobject.size
- It is used to set the HR size property.
hrobject.size="value"
Property Values:
- value: It contains the pixel value which specify the height of the HR element.
Return value: It returns a string value that represents the height of the HR element.
Example 1: This example returns the HR size property.
HTML
<!DOCTYPE html>
< html >
< head >
< title >HTML DOM HR size property</ title >
</ head >
< body >
< h1 >GeeksForGeeks</ h1 >
< h2 >DOM HR size Property</ h2 >
< p >
There is a horizontal rule
below this paragraph.
</ p >
< hr id = "GFG" align = "left" size = "10px"
width = "240px" color = "red" >
< p >
This is a horizontal rule
above this paragraph.
</ p >
< button onclick = "myGeeks()" >
Try it
</ button >
< h3 id = "sudo" ></ h3 >
< script >
function myGeeks() {
// return the HR size property
var x = document.getElementById("GFG").size;
document.getElementById("sudo").innerHTML = x;
}
</ script >
</ body >
</ html >
|
- Before Clicking on Button:
- After Clicking on Button:
Example 2: This example sets the HR size property.
HTML
<!DOCTYPE html>
< html >
< head >
< title >HTML DOM HR size property</ title >
</ head >
< body >
< H1 >GeeksForGeeks</ H1 >
< h2 >DOM HR size Property</ h2 >
< p >
There is a horizontal rule
below this paragraph.
</ p >
< hr id = "GFG" align = "left" size = "10px"
width = "240px" color = "red" >
< p >
This is a horizontal rule
above this paragraph.
</ p >
< button onclick = "myGeeks()" >Try it</ button >
< h3 id = "sudo" ></ h3 >
< script >
function myGeeks() {
// set HR size property
var x =
document.getElementById("GFG").size = "5";
document.getElementById("sudo").innerHTML
= "The value of the size Attribute "
+ "was changed to " + x;
}
</ script >
</ body >
</ html >
|
- Before Clicking on Button:
- After Clicking on Button:
Supported Browsers: The browser supported by DOM HR size property are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Safari
- Opera
Last Updated :
24 Aug, 2022
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...