Muchos ejemplos de todo tipo

Tabla de contenido

  1. Formateos fisicos
  2. Formateos logicos
  3. Formateo de bloques
  4. Tipos, tamaños y colores de letra
  5. Titulos
  6. Caracteres especiales
  7. Lineas horizontales
  1. Listas
  2. Imagenes en linea
  3. Tabla
  4. Formularios
  5. Texto en movimiento

1. Formateos fisicos

Regresar a tabla de contenidos


2. Formateos logicos

Regresar a tabla de contenidos


3. Formateo de bloques

3.1 Direcciones <ADDRESS>

Se trata normalmente de direcciones, firmas de autor, correo electronico etc
Universidad ALAS Peruanas
Av San Felipe 1109
Jesús María
Lima-Peú
Telefax: 470-9838

3.2 Texto preformateado <PRE>

Este texto esta preformateado usando <PRE>.  Espacios multiples    y
retornos de carro son reconocidos.  El texto preformateado no salta de linea y puede tener un enlace tambien. 

3.3 Texto literal <LIT>

Muy parecido en su funcion al texto preformateado solo que este esta en funte proporcional. Se nota la direrencia ?

3.4 Texto <BLOCHQUOTE>

Se trata normalmente de texto de otra fuente al cual no estamos refiriendo y lo queremos mostrar diferente. Nota la sangria...

3.5 Autor <BYLINE>

Usado para hacer notar al autor de un escrito.

3.6 Comentario <!-- -->

A continuacion un comantario:<!-- Hoy es: 14-07-96 y son las 11:03:35 AM -->
A continuacion un comantario:

3.7 Texto centrado <CENTER>

Aqui una linea de texto centrada.

La mayoria de estas etiquetas estan obsoletas y fueron reemplazadas por css.

Regresar a tabla de contenidos


4. Tipos, tamaños y colores de letra

Font control (Face names, color, size) may be achieved by setting through the use of tags in the HTML document.

Regresar a tabla de contenidos


5. Titulos

Regresar a tabla de contenidos


6. Caracteres especiales

En los documentos HTML, algunos caracteres deben ser metidos de forma especial.

Regresar a tabla de contenidos


7. Lineas horizontales

<HR COLOR=red NOSHADE>
<HR COLOR=navy WIDTH=80% SIZE=3 ALIGN=right>
<HR COLOR=green WIDTH=50% SIZE=10 ALIGN=center>

Color gobierna el color del fondo pero si no se le da un ancho de por la menos 3 no se notara, como es el caso de la primera.




Regresar a tabla de contenidos


10. Listas

10.1 Lista numerada <OL>

  1. Uno
  2. Dos
  3. Tres
  1. Uno
  2. Dos
  3. Tres
  1. Uno
  2. Dos
  3. Tres
  1. Uno
  2. Dos
  3. Tres
  1. Uno
  2. Dos
  3. Tres

10.2 Lista no numerada <UL>

Con disc (omision)Con circlecon square
  • Linea 1
  • Linea 2
  • Linea 3
  • Linea 1
  • Linea 2
  • Linea 3
  • Linea 1
  • Linea 2
  • Linea 3

10.3 Lista de Definiciones <DL>

Termino 1
Definiendo el termino 1
Termino 2
Definiendo el termino 2

10.4 Lista de Directorio <DIR>

Se ve igual que la lista no numerada

  • Item 1
  • Item 2
  • 10.5 Lista Menu <MENU>

    Se ve igual que la lista no numerada

  • Item 1
  • Item 2
  • 10.6 Las listas se pueden anidar de muchas maneras:

    1. Primer Item
      1. Primer Sub Item
        • Primer Sub Sub Item
        • Segundo Sub Sub Item
      2. Segundo Sub Item
    2. Segundo Item

    Regresar a tabla de contenidos


    11. Imagenes en linea

    <img src=action.gif alt=action.gif>
    

    Aqui una imagen en linea. action.gif

    Si la imagen no es encontrada se presentara un error asi:

    Como podras observar en la primera imagen, el texto al rededor de la imagen es alineado en la linea inferior (default). Pero con el parametro ALIGN= es posible cambiar esta alineacion...

    Accion centrada por ejemplo aqui esta con ALIGN=center.

    Accion arriba y aqui en linea superor con ALIGN=top.

    Una imagen tambien puede ser enlace un enlace de hipertexto.

    Regresar a tabla de contenidos


    12. Tabla

    <TABLE BORDER CELLPADDING=5>
    <TR><TH>Peso<TH>Recargo
    <TR><TD>Hasta 10 Kg<TD ALIGN=center>$ 1.80
    <TR><TD>Mas de 10 Kg<TD ALIGN=center>$ 2.50
    </TABLE>
    

    Tabla muy basica

    PesoRecargo
    Hasta 10 Kg$ 1.80
    Mas de 10 Kg$ 2.50

    Regresar a tabla de contenidos


    13. Formularios HTML

    El siguiente formulario te permite ordenar una piza en el famoso restoran "La Piza Cachosa" de propiedad del Ing. Oscar Lagravere

    Ordenar Pizzas
    Nombre:
    Direccion:
    Tipo:
    Doble Queso
    Jamon
    Anchoas
    Cebolla
    Tamaño:
    Personal
    Grande
    Familiar
    Terminator
    Forma de pago:

    Instrucciones especiales:

    Regresar a tabla de contenidos


    14. Texto en movimiento

    <Marquee BGCOLOR=yellow LOOP=-1>Con fondo 14.2</Marquee>
    <Marquee BEHAVIOR=alide SCROLLAMOUNT=30 DIRECTION=right>El rapido a derecha 14.3</Marquee>
    <Marquee WIDTH=60% SCROLLDELAY=100 LOOP=-1>Prueba 14.4</Marquee>
    <FONT COLOR=white size=6px>
    <Marquee WIDTH=50% HEIGHT=50 SCROLLDELAY=100 BEHAVIOR=alternate BGCOLOR=red LOOP=-1>Ancho y reboton 14.5</Marquee>
    </FONT>
    
    El mas simple... 14.1 Con fondo 14.2 El rapido a derecha 14.3 Prueba 14.4 Ancho y reboton 14.5

    Regresar a tabla de contenidos