Tutorial de HTML (VII)

Separadores en html. La etiqueta <hr>

Para separar un texto de otro o un párrafo de otro podemos utilizar una línea horizontal de un tamaño o un grosor determinado por nosotros. Esa franja la escribimos con la etiqueta <hr>. La contrario que muchas etiquetas html, ésta no necesita ser cerrada. Sólo con escribir la etiqueta anterior ya la escribimos.

La etiqueta <hr>, como muchas otras etiquetas, puede variar de aspecto dependiendo de las reglas CSS que definamos.

Definir su grosor

A continuación te vamos a ofrecer dos ejemplos de franjas con diferentes grosores, siendo la primera 15px y la segunda 2px. La diferencia es abismal.

<hr size="15px"><hr size="2px">

 

Definir su anchura

En el caso de no escribir nada (como en los ejemplos anteriores), la franja será predeterminada del 100%. Si queremos que ocupe más o menos tendremos que escribirlo con el atributo width.

A continuación vamos a escribir una franja de 75% de ancho:

<hr style="width:75%;">

Definir su color

También podemos predefinir el color que le queremos dar a la franja con el atributo CSS “border-color”. Es muy sencillo. Por ejemplo, si queremos que nuestra franja sea de color rojo sólo debemos ponerle la etiqueta:

<hr color="black">

Si queremos combinar las opciones, escribiríamos algo así:

<hr size="30px" color="white">

<hr size="8px" color="black" />

<hr size="30px" color="white" style="width:25%;">

 

 

Tutorial de HTML (VIII)