HTML tutorial: HTML horizontal line segments

Time:2022-6-9

This tab can display a horizontal line on the screen to divide different parts of the page.
<hr> has three attributes:
Size width of horizontal line
Width the length of a horizontal line, expressed as a percentage of the screen width or as a pixel value
Align there are three ways to align horizontal lines: left right center
The noshade segment has no shadow attribute and is a solid segment
We can use several examples to illustrate the usage of this line segment:


Setting of segment thickness
<HTML>
<HEAD>
<title> segment thickness setting </title>
</HEAD>
<BODY>
<P> This is the first line segment. There is no size setting. Take the internal fixed value size=1 to display <br>
<HR />
<P> This is the second segment, size=5<br>
<HR SIZE=5>
<P> This is the third segment, size=10<br>
<HR SIZE=10>
</BODY>
</HTML>


Setting of segment length
<HTML>
<HEAD>
<title> setting of segment length </title>
</HEAD>
<BODY>
<P> This is the first line segment. There is no width setting. Take 100% of the internal fixed value of width to display <br>
<HR SIZE=3>
<P> This is the second line segment, width=50 (point count method) <br>
<HR WIDTH=50 SIZE=5>
<P> This is the third segment, width=50% (percentage method) <br>
<HR WIDTH=50% SIZE=7>
</BODY>
</HTML>


Setting of line segment arrangement
<HTML>
<HEAD>
<title> setting of line segment arrangement </title>
</HEAD>
<BODY>
<P> This is the first line segment, without align setting, (take the internal constant value center display) <br>
<HR WIDTH=50% SIZE=5>
<P> This is the second line segment, aligned leftbr>
<HR WIDTH=60% SIZE=7 ALIGN=LEFT>
<P> This is the third line segment, aligned to the right <br>
<HR WIDTH=70% SIZE=2 ALIGN=RIGHT>
</BODY>
</HTML>


No shadow setting
<HTML>
<HEAD>
<title> no shadow setting </title>
</HEAD>
<BODY>
<P> This is the first line segment. There is no noshade setting. The shadow effect of the internal fixed value is used to display <br>
<HR WIDTH=80% SIZE=5>
<P> This is the second line segment with noshade setting <br>
<HR WIDTH=80% SIZE=7 ALIGN=LEFT NOSHADE>
</BODY>
</HTML>

Last horizontal line: