Paso 15: Líneas Horizontales

Tenemos tres formas principales de introducir una línea que marque una división entre los post:

1. Mediante la etiqueta <HR alt="-" align="left" width="80%">.
   
   

   ---

   
   
2. Insertando una imagen. Por ejemplo,
   
   <img src="/imagenes/lineadecorativa.jpg" height="40" width="320" alt="-" title="">
   
   
   
   
3. Sin embargo, cuando queremos introducir una imagen como la anterior la solución más correcta sería crear un estilo y aplicarlo. Por ejemplo:
   
   div.hr {
   height: 40px;
   background: url(/imagenes/lineadecorativa.jpg) no-repeat scroll center;
   }
   div.hr hr {
   display: none;
   }
   
   Donde el campo Height es equivalente en pixels a la altura de la imagen que vamos a colocar. Introduciremos la línea horizontal mediante el siguiente código:
   
   <div class="hr"><hr alt="-"></div>
   
   

   ---

   
   De esta forma, los navegadores visuales mostrarán la imagen y los lectores de pantalla mostrarán una regla horizontal formada por guiones.