Ejemplos HTML


Contenido

  1. Estilos de Caracteres
  2. Cabeceras
  3. Tipos de letras
  4. Listas
  5. Imágenes
  6. Caracteres especiales
  1. Direcciones
  2. Texto Preformateado
  3. Texto en Blockquote
  4. Texto centrado
  5. Tablas
  6. Formularios

Estilos de Caracteres

Negrita <b>
Cursiva <i>
Subrayado <u>
Resaltado <em>
Destacado <strong>
Código <code>
Citas <cite>
Máquina de escribir <kbd>
Ejemplos <samp>
Teletipo <tt>
Variables <var>
Negrita y cursiva <b><i>

Contenido

Cabeceras

Cabecera 1

<h1>

Cabecera 2

<h2>

Cabecera 3

<h3>

Cabecera 4

<h4>
Cabecera 5
<h5>
Cabecera 6
<h6>

Contenido

Tipos de letras

Se pueden definir las características de tipo, tamaño y color de letra mediante la marca <font>y los atributos face, size y color, respectivamente.


Contenido

Listas

Listas ordenadas <ol> <li> ... <li> </ol>
  1. Linea 1
  2. Linea 2

Listas sin orden <ul> <li> ... <li> </ul>

Listas de definición <dl> <dt> <dd> ... <dt> <dd> </dl>

Termino 1
Definición del 1 término.
Termino 2
Definición del 2 término.

Listas de directorio <dir> <li> ... <li> </dir> (similares a las listas sin orden)

  • Elemento 1
  • Elemento 2
  • Listas de menú <menu> <li> ... <li> </menu> (similares a las listas sin orden)

  • Elemento 1
  • Elemento 2
  • Las listas pueden ser anidadas de varias formas

    1. Primer Capítulo
    2. Segundo Capítulo
    Contenido

    Imágenes

    Aquí hay una imagen. glass.gif Mediante la marca <img src="archivo_imagen"> una imagen es mostrada, a no ser que exista algún error, en cuyo caso se muestra un símbolo que lo indica.
    Las imágenes pueden ser justificadas por la parte inferior del texto (por defecto), por la parte superior (top), o centradas (middle), mediante el atributo align.

    Las imágenes pueden ser también punto de enlace puntos de enlace.

    
    
    
    Contenido

    Caracteres especiales

    En un documento HTML, algunos caracteres deben de ser introducidos de forma especial cuando no forman parte del código sino de un texto.

    Contenido

    Direcciones

    Un bloque de dirección podrá ser definido entre las marcas <address> y </address>. Normalmente la dirección especificada se muestra en cursiva.
    
    
    Tekin Tontu
    77A Wellington Rd
    Auburn 2144, NSW
    Australia

    Texto Preformateado

    Esto es un texto preformateado definido entre <pre> y </pre>.
    Varios espacios     y saltos de carro
    
    son reconocidos en este tipo de texto. Puede también contener hipertextos. 
    
    

    Texto en Blockquote

    Este texto está dentro de la marca <blockquote>. ésta es utilizada para desplazar el bloque de texto completo a la derecha y generar espacios de tipo párrafo antes y después de dicho bloque.

    Texto Centrado

    Aqui tiene dos línea de texto centradas
    mediante la marca <center>.

    Contenido

    Tablas

    Las tablas se generan utilizando principalmente: <table> (para definir la tabla), <tr> (para iniciar líneas), <td> (para delimitar el inicio de una celda).
    
    
    Altura Peso
    1,87 metros 92 kilos
    1,79 metros 75 kilos

    Muchas otras variantes sobre las tablas se muestran en el Tutorial de Tablas.

    
    
    
    Contenido

    Formularios HTML

    Para consultar la elaboración de este formulario se aconseja examinar el código de ésta página.
    Pedido de Pizza
    Nombre:
    Dirección:
    Ingredientes
      Queso
      Pimiento
      Cebolla
    Tamaño
      Pequeña
      Mediana
      Grande
    Forma de Pago
     
    Instrucciones Especiales
     

    Contenido

    Indice

    Facultad de Informática de la Universidad de Las Palmas de Gran Canaria