This will give you a left aligned <hr />

<!-- ~~~~~~~~~~~~~ CODE ~~~~~~~~~~~ -->

<hr style="width: 50%;
  /*this will align it for IE*/
  text-align: left;
  /*this will align it left for Other Browsers*/
  margin: 0 auto 0 0;">

This will give you a right aligned <hr />

<!-- ~~~~~~~~~~~~~ CODE ~~~~~~~~~~~ -->

<hr style="width: 50%;
  /*this will align it for IE*/
  text-align: right;
  /*this will align it right for Other Browsers*/
  margin: 0 0 0 auto;">

This will give you a dashed red <hr />

<hr style="border: none 0;
  /*the border*/
  border-top: 1px dashed #c00;
  text-align: center;
  /*Total width of border-top and border-bottom*/
  height: 1px;">

This will give you a Grey <hr />

<hr style="border: none 0;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #efefef;
  width: 80%;
  height: 2px;   margin: 10px auto;
  text-align: center;">

This will give you a dashed black <hr />

<hr style="border: none 0;
  border-top: 1px dashed #000;
  border-bottom: 1px dashed #ccc;
  width: 80%;
  height: 2px;   margin: 10px auto;
  text-align: center;">

This will give you a Light Blue <hr />

<hr style="border: none 0;
  border-top: 1px dashed #000;
  border-bottom: 1px dashed #ccc;
  width: 80%;
  height: 2px;   margin: 10px auto;
  text-align: center;">

This will give you a Double Red <hr />

<hr style="border: none 0;
  border-top: 1px dashed #000;
  border-bottom: 1px dashed #ccc;
  width: 80%;
  height: 2px;   margin: 10px auto;
  text-align: center;">

This will give you a Bevelled Black <hr />

<hr style="border: none 0;
  border-top: 1px dashed #000;
  border-bottom: 1px dashed #ccc;
  width: 80%;
  height: 2px;   margin: 10px auto;
  text-align: center;">

This will give you a Green and Yellow <hr />

<hr style="border: none 0;
  border-top: 1px dashed #000;
  border-bottom: 1px dashed #ccc;
  width: 80%;
  height: 2px;   margin: 10px auto;
  text-align: center;">