you can create an <hr> tag in the exact way that you have mentioned in your OP. You can add styles to it in the same way you can add styles to any other element. You can add them inline ie:
<hr style="width:100%;border:1px solid black;>
or, a better way to apply styles to an element is through adding specific classes to your element.
For example your HTML may look something similar to this:
and you would create a CSS class called .custom-seperator and apply styles to it like so:
border:1px solid black;
You can add the same class to all <hr> tags, so when you want to adjust a color, width or any other property you can go into the CSS and target all of your <hr> elements at the same time.
I hope this helps and points you in the right direction.