In HTML a horizontal line could be drawn using <hr> tag.
E.g.:
<html>
<body>
<p> This is a paragraph. Now I will draw a line <hr /> Now continuing with the paragraph. This is the end </p>
</body>
</html>
Copy the above code and paste in a notepad and save it as .htm or .html. Then open in a web browser to see the output.
It is enough to user <hr> to draw a line. But according to World Wide Web consortium you should close the tag. Hence it is always suggested to close the tag <hr />.
The alignment, color, width, height and even shadow feature of the line could be controlled by the user with the help of attributes. The following are some the attributes which could be used with line.
1. “width”: It accepts the value as pixels.
E.g. width = “100”
The above example will display a line with a width of 100 pixels. You could also use width = “50%”. But it is deprecated and some browsers don’t support this format.
2. “size”: It takes the value as pixels. It controls the height of the line.
E.g. size = “10”.
The above example will display a line which has a width of 10 pixels. You could also use “%” format, but that format is deprecated.
3. “color”: It takes the hex code or the name of the color to apply as background color of horizontal line. Netscape navigator does not support this feature.
E.g. color=”green”
The above example will turn the color of the line to green.
4. “noshade”: It can be used without any value. But W3C markup validation does not accept it. W3C suggest to use it as
noshade=”noshade”
According to W3C every attribute should have a value assigned. This attribute hides the shadow of horizontal line.
5. “align”: It takes 3 values namely “left”, “right” and “center”. It aligns the horizontal line to its value. The effect could be seen only if the length of the line is less than that of the browser.
E.g. 1: <hr />
E.g. 2: <hr width=”50” size=”20” />
