HR + CSS split line

Solid line: <HR Align = left width = 490 color = #990099 size = 3 noshade>

 

Vertical Line: <HR Align = center width = 1 color = Red size = 100>

Dotted Line: <HR size = 1 style = "color: Blue; border-style: dotted; width: 490px; color: # CCC">

Double Line: <HR size = 1 style = "color: # ff9999; border-style: Double; width: 490px; color: # CCC">

Stereo: <HR size = 8 style = "color: # ffd306; border-style: outset; width: 490px; color: # CCC">

Gradually become transparent on the left: <HR size = "2" color = "# ff9966" style = "filter: alpha (opacity = 10, finishopacity = 100, style = 1, startx = 0, starty = 0, finishx = 100, finishy = 100); width: 490; ">

Gradually become transparent on the right: <HR size = "2" color = "# ff9966" style = "filter: alpha (opacity = 10, finishopacity = 100, style = 1, startx = 100, starty = 100, finishx = 0, finishy = 0); width: 490; ">

Style:

The Code is as follows:

<HR style = "width: 100%; color: #999; border-top-style: dashed; border-right-style: dashed; border-left-style: dashed; height: 1px; border-bottom-style: dashed ">

Use the <HR> label
Basic: <HR width = 300 size = 1 color = #5151a2 align = center noshade>
Width specifies the length of a line, which can also be a percentage. color indicates color, and size indicates thickness;
Align specifies the line position, including left (left-aligned), right (right-aligned), and center (center-aligned). noshade indicates whether the line has a stereoscopic effect.

Gradient transparency at both ends: (using CSS filters)
<HR width = 80% size = 3 color = #5151a2 style = "filter: alpha (opacity = 100, finishopacity = 0, style = 3)">

Gradient transparency on the right:
<HR width = 80% size = 3 color = #5151a2 style = "filter: alpha (opacity = 100, finishopacity = 0, style = 1)">
Dotted line:
<HR width = 80% size = 1 color = #5151a2 style = "border: 1 dashed #5151a2">

Draw two lines:
<HR width = 80% size = 3 color = #5151a2 style = "border: 3 double green">

Stereoscopic effect:
<HR width = 80% size = 3 color = #5151a2 style = "filter: progid: DXImageTransform. Microsoft. Shadow (color #5151a2, direction: 145, strength: 15)">

Spinning shape:
<HR width = 80% size = 30 color = #5151a2 style = "filter: alpha (opacity = 100, finishopacity = 0, style = 2)">

Steel Needle effect:
<HR width = 80% size = 3 color = #5151a2 style = "filter: progid: DXImageTransform. Microsoft. Glow (color = #5151a2, strength = 10)">
You can also use the <Table> label
For example, <Table width = "100%"> <tr> <TD Height = "1" bgcolor = "# ff0000"> </TD> </tr> </table> tables)
Horizontal dash: <TD style = "Background: url(dot.gif) Repeat-x Center"> & nbsp; </TD>
Vertical DASH: <TD style = "Background: url(dot.gif) Repeat-y center"> & nbsp; </TD>
Of course there are many other methods. You can refer to HTML and CSS related materials.