HTML | DOM HR width Property
The DOM HR width Property is used to set or return the value of the width attribute of an HR Element.
Syntax:
- It returns a HR width Property.
hrobject.width;
- It sets the HR width Property.
hrobject.width="value";
Property Values
- pixel: It specifies the width of the HR Element in terms of pixels.
Return value: It returns a string value which represents the width of the an HR Element.
Example 1: This example returns the HR width property.
<!DOCTYPE html> <html> <head> <title>HTML DOM hr width property</title> </head> <body> <H1>GeeksForGeeks</H1> <h2>DOM HR width Property</h2> <p>There is a horizontal rule below this paragraph.</p> <!-- Assigning id to 'hr' tag. --> <hr id="GFG" align="left" width="140px"> <p>This is a horizontal rule above this paragraph.</p> <button onclick="myGeeks()">Try it</button> <h3 id="sudo"></h3> <script> function myGeeks() { // Accessing 'hr' tag. var x = document.getElementById("GFG").width; document.getElementById("sudo").innerHTML = x; } </script> </body> </html> |
chevron_right
filter_none
Output:
- Before Clicking on the Button:
- After Clicking on the Button:
Examole 2: This example sets the HR width property.
<!DOCTYPE html> <html> <head> <title>HTML DOM hr width property</title> </head> <body> <H1>GeeksForGeeks</H1> <h2>DOM HR width Property</h2> <p>There is a horizontal rule below this paragraph.</p> <!-- Assigning id to 'hr' tag. --> <hr id="GFG" align="left" width="140px"> <p>This is a horizontal rule above this paragraph.</p> <button onclick="myGeeks()">Try it</button> <h3 id="sudo"></h3> <script> function myGeeks() { // Accessing 'hr' tag. var x = document.getElementById("GFG").width = "280px"; document.getElementById("sudo").innerHTML = "The value of the width Attribute was changed to " + x; } </script> </body> </html> |
chevron_right
filter_none
Output:
- Before Clicking on the Button:
- After Clicking on the Button:
Recommended Posts:
- HTML | DOM Style width Property
- HTML | DOM Video width Property
- HTML | DOM IFrame width Property
- HTML | Screen width Property
- HTML | DOM Object width Property
- HTML | DOM Input Image width Property
- HTML | canvas ImageData width Property
- CSS | min-width Property
- CSS | max-width Property
- CSS | border-top-width Property
- CSS | outline-width Property
- Web API | DOMRect width property
- CSS | border-right-width Property
- CSS | column-width Property
- CSS | border-width Property
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.
