HTML Básico

AMPLIAR

Convenios

Estructura de una Página




<HTML>



<HEAD>

  <TITLE>El titulo</TITLE>

</HEAD>



<BODY>

   El contenido de la página:

   Texto, imágenes, enlaces, etc.

</BODY>



</HTML>

Formatear párrafos

Este es el primer párrafo que usaré en este ejemplo sobre como se deben formatear los párrafos en un documento HTML.

Un nuevo párrafo.
Segunda línea.


  for (i=1 ; i<10 ; i++) {

     print $i

  }

  
Un blockquote:
En un lugar de la Mancha de cuyo nombre no quiero acordarme, vivía un ilustre caballero



<P>

Este es el primer párrafo 

que usaré en este 

ejemplo sobre como 



se deben formatear los párrafos

en un documento HTML.

</P>

<P> 

Un nuevo párrafo.<BR>Segunda línea.

</P>

<PRE>

  for (i=1 ; i<10 ; i++) {

     print $i

  }

</PRE>

Un blockquote:

<BLOCKQUOTE>

  En un lugar de la Mancha 

  de cuyo nombre 

  no quiero acordarme, vivía

  un ilustre caballero

</BLOCKQUOTE>

  

Cabeceras

Listas numeradas

Listas no numeradas

Listas menú

  • Primera entrada
  • Segunda entrada
  • Tercera entrada
  • 
      <MENU>
    
        <LI> Primera entrada
    
        <LI> Segunda entrada
    
        <LI> Tercera entrada
    
      </MENU>
    
      

    Listas directorio

  • Primera entrada
  • Segunda entrada
  • Tercera entrada
  • 
      <DIR>
    
        <LI> Primera entrada
    
        <LI> Segunda entrada
    
        <LI> Tercera entrada
    
      </DIR>
    
      

    Listas de definiciones

    Uno:
    Primera entrada del glosario del ejemplo
    Dos:
    Segunda entrada
    Tres:
    Tercera entrada
    
      <DL>
    
        <DT> Uno:  <DD> Primera entrada 
    
                       del glosario del 
    
                       ejemplo
    
        <DT> Dos:  <DD> Segunda entrada
    
        <DT> Tres: <DD> Tercera entrada
    
      </DL>
    
      

    Enfatizadores lógicos

    texto normal texto normal
    texto resaltado <EM>texto resaltado</EM>
    texto muy resaltado <STRONG>texto muy resaltado</STRONG>
    código fuente <CODE>código fuente</CODE>
    texto como ejemplo <SAMP>texto como ejemplo</SAMP>
    texto a teclear <KBD>texto a teclear</KBD>
    nombre de variable <VAR>nombre de variable</VAR>
    definición <DFN>definición</DFN>
    una cita <CITE>una cita</CITE>
    inline quote <Q>inline quote</Q>

    Enfatizadores físicos

    texto normal texto normal
    texto más grande <BIG>texto más grande</BIG>
    texto más pequeño <SMALL>texto más pequeño</SMALL>
    texto en negrita <B>texto en negrita</B>
    texto en itálica <I>texto en itálica</I>
    typewriter font <TT>typewriter font</TT>
    texto subrayado <U>texto subrayado</U>
    texto tachado <STRIKE>texto tachado</STRIKE>
    texto parpadenate <BLINK>texto parpadeantelt;/BLINK>
    Sólo Netscape
    textosubindice texto<SUB>subindice</SUB>
    textosuperindice texto<SUP>superindice</SUP>

    Caracteres especiales

    " &quot; &#34;
    & &amp; &#38;
    á &aacute; &#225;
    é &eacute; &#233;
    ü &uuml; &#252;
    ñ &ntilde; &#241;
    non-breaking space &nbsp;  

    Fuentes

    Líneas horizontales


    <HR>

    <HR WIDTH=200>

    <HR WIDTH=50%>

    <HR WIDTH=200 ALIGN=left>

    <HR WIDTH=200 ALIGN=right>

    <HR SIZE=10>

    <HR NOSHADE SIZE=10>

    Centrado

    Ejemplo:
    texto centrado
    
    Ejemplo:
    
    <CENTER>
    
    texto centrado
    
    </CENTER>
    
    

    Dirección

    El documento
    Enrique A. de la Cal Marín
    Universidad de Oviedo
    
    
    
      El documento
    
    
    
      <HR>
    
    
    
      <ADDRESS>
    
        Enrique A. de la Cal Marín<BR>
    
        Universidad de Oviedo
    
      </ADDRESS>
    
      

    Enlaces

    URL

    Atributos de BODY

    Color uniforme de fondo <BODY BGCOLOR=yellow>
    Imagen como fondo <BODY BACKGROUND=nubes.gif>
    Color del texto <BODY TEXT=blue>
    Color de los enlaces <BODY LINK=white>
    Color de los enlaces visitados <BODY VLINK=black>
    Color de los enlaces activos <BODY ALINK=#44dd44>