Cómo crear: línea de separación

Aprende a usar CSS para crear diferentes líneas de separación.

En raya


Punteado


Sólido


Redondeado


Prueba personal

Cómo crear una línea de separación

Primer paso - Añadir HTML:

<hr class="raya">
<hr class="punteada">
<hr class="sólida">
<hr class="redondeada">

Segundo paso - Añadir CSS:

/* Bordes en raya */
hr.raya {
  border-top: 3px dashed #bbb;
}
/* Bordes punteados */
hr.punteada {
  border-top: 3px dotted #bbb;
}
/* Bordes sólidos */
hr.sólida {
  border-top: 3px solid #bbb;
}
/* Bordes redondeados */
hr.redondeada {
  border-top: 8px solid #bbb;
  border-radius: 5px;
}

Prueba personal