HR es una de esas etiquetas que van cayendo en el olvido sin embargo es posible hacer cosas interesantes con esta etiqueta, que en un principio luce muy aburrida pero es posible con un poco CSS darle un poco de vida
HR con colores sólidos
Podría por ejemplo cambiarle el color con este código
[cc lang=»css»]
color: #f8b500;
background-color: #f8b500;
height: 5px;
border:none;
[/cc]
Y obtenemos:
HR punteada
No es necesario que nuestro separador sea sólido, podría ser punteado o con lineas entrecortadas
[cc lang=»css»]
color: #f8b500;
height: 0px;
border:1px dashed;
[/cc]
Separador con imágenes
No se puede directamente con CSS sobre un HR ya que los bordes siempre aparecen, sin embargo es posible para estos casos usar un div con un fondo de imagen