Writing HTML | Acerca de | FAQ | Alumnos | Tags | Lecciones | anterior | siguiente |

13. °Puede Tabularme!

"øQuÈ ocurre aquÌ?" preguntÛ la etiqueta <blockquote> a las etiquetas <p> y <br>. Ellas respondieron, "°No estamos seguras pero t™ eres muy diferente de nosotras!"

Objetivos

• Insertar un bloque de texto indentado respecto del texto general.
• Aplicar etiquetas de estilo dentro de un bloque de texto indentado.

LecciÛn

Tradicionalmente, la separaciÛn de tres o m·s lÌneas de texto (o las citas) se efect™a como una indentaciÛn del bloque entero. El HTML tambiÈn incluye esta posibilidad utilizando la etiqueta <blockquote>....</<blockquote>:

<blockquote>
"Esta es una larga cita de una persona muy famosa. Ya que es tan larga
e interesante deberÌa situarse destacada del resto del texto.
Esto indica claramente que la cita es de alguien distinto del escritor."
</blockquote>

---

"Esta es una larga cita de una persona muy famosa. Ya que es tan larga e interesante deberÌa situarse destacada del resto del texto. Esto indica claramente que la cita es de alguien distinto del escritor."

---

Note que podemos aplicar cualquier cÛdigo HTML que hemos aprendido dentro de las etiquetas <blockquote>, tal y como se ve en el siguiente ejemplo:

<blockquote>
<h2>Un Manifiesto</h2>
Esta es una <B>larga</B> cita de una
<a href="http://www.mcli.dist.maricopa.edu/alan/">
persona muy famosa</a>. 
Ya que es tan larga e interesante deberÌa situarse
<pre>     destacada</pre>
del resto del texto.
<p>
<I>Esto indica</I>:
<ul> 
<li>claramente que
<li>la cita es de
<li>alguien distinto del escritor.
</ul>
</blockquote>

---

Un Manifiesto

Esta es una larga cita de una persona muy famosa. Ya que es tan larga e interesante deberÌa situarse

        destacada

del resto del texto.

Esto indica:

• claramente que
• la cita es de
• alguien distinto del escritor.

---

AÒadamos una descripciÛn indentada a la introducciÛn a nuestra p·gina Web de Volcanes. Usaremos una cita de un naturalista romano, Plinio, quien fue testigo de la erupciÛn del Vesubio en el aÒo 79 d.C.

1. Abra el archivo index.htm en su editor de textos.
2. Bajo el encabezado <h1>Web de Volcanes</h1> aÒada lo siguiente:

   
     <BLOCKQUOTE>
     <b><I>
     "La Naturaleza se enfurece salvajemente, amenazando las tierras"
     </I></b><br>
      -- <a href="http://magic.geol.ucsb.edu/~fisher/pliny.htm">
     Plinio el Viejo</A>, quien muriÛ de asfixia despuÈs de
     observar la destrucciÛn de Pompeya por la erupciÛn
     del Vesubio en el aÒo 79 d.C.
     </BLOCKQUOTE>
   

   NOTA: Vea cÛmo hemos usado una combinaciÛn de etiquetas de estilo negrita y cursiva (vea la LecciÛn 5) para enfatizar la cita. La cita es forzada a aparecer en una nueva lÌnea con la etiqueta <br> (vea la LecciÛn 4). TambiÈn hemos "activado" el texto "Plinio el Viejo" hacia otra p·gina web que contiene m·s informaciÛn acerca de Plinio y sus observaciones.

   Vea tambiÈn cÛmo la etiqueta <blockquote> fuerza una ruptura de p·rrafo antes y despuÈs del bloque de texto.

   °Y observe, finalmente, estas NOTAS (como esta misma) que ha estado viendo a lo largo del tutorial hacen uso de la etiqueta <blockquote>!

3. Salve y Actualice el archivo HTML.

Compruebe Su Trabajo

RevisiÛn

1. øQuÈ hace la etiqueta <blockquote>?
2. øPorquÈ no se necesita una etiqueta <p> antes de indentar un bloque de texto?

Pr·ctica Independiente

Algunos diseÒadores utilizan 2 (o m·s) etiquetas <blockquote> anidadas para crear efectos de retoque de margenes. Por ejemplo:

<BLOCKQUOTE>
  <BLOCKQUOTE>
    <BLOCKQUOTE>"°Oh, m·s etiquetas!", se lamentÛ.
      <p>Y ella replicÛ, "Recuerda, cariÒo, que mientras que el HTML pueda
      estar limitado en tÈrminos de control
      sobre el diseÒo de las p·ginas hay un gran
      potencial en el uso del n™mero de etiquetas."
    </BLOCKQUOTE>
  /BLOCKQUOTE>
</BLOCKQUOTE>

que produce:

"°Oh, m·s etiquetas!", se lamentÛ.

Y ella replicÛ, "Recuerda, cariÒo, que mientras que el HTML pueda estar limitado en tÈrminos de control sobre el diseÒo de las p·ginas hay un gran potencial en el uso del n™mero de etiquetas."

A ContinuaciÛn....

IR A.... | Õndice de Lecciones | anterior: "Direcciones a Pie de P·gina y Links a E-Mails" | siguiente: "Agrupando vs Dividiendo" |

URL: