HTML Basico

Lenguaje HTML

HyperText Markup Language (HTML) describe los documentos mediante etiquetas.
Etiquetas encerradas entre < y > con / indicando fin de etiqueta.

Tipos:

  • Pareadas (<H1> </H1>)
  • Sin parear (<BR>)
  • Opcionales (<P> </P>)

Las Etiquetas:

  • Mantienen un formato general a seguir:
    • <etiqueta>contenido</etiqueta>
  • Los comentarios que no se ven:
    • <! Comentario>
  • Las etiquetas fundamentales de un documento HTML:
    • <HTML></HTML>
    • <HEAD></HEAD>
    • <BODY></BODY>

Estructura general de un documento HTML:

<DOCTYPE HTML PUBLIC>
<HTML>
<HEAD>
………………..
</HEAD>
<BODY>
………………..
</BODY>
</HTML>

Estructura general de un documento HTML:

Aqui presentamos un ejemplo de como va quedando al introduccir el codigo en html

<DOCTYPE HTML PUBLIC>
<HTML>
<HEAD>
<TITLE>Mi primera página de prueba HTML</TITLE>
</HEAD>
<BODY>
Aquí se pone la información que se desea que tenga el documento…
</BODY>
</HTML>

Imagen1.png

Formateo elemental de textos

  • Encabezamientos
    • <H1></H1>………..<H6></H6>
  • Salto de párrafo
    • <P></P>
  • Centrado
    • <CENTER></CENTER>
  • Negrita y Cursiva
    • <B></B> <I></I>

Atributos de etiquetas

  • Alineación de párrafos
    • Izquierda: ALIGN=left (opción por defecto)
    • Derecha: ALIGN=right
    • Centrado: ALIGN=center
  • Utilización.
    • <p ALIGN=opción>

Ejemplo de Etiquetas para estructurar el texto Títulos

<H1>Este es el título 1</H1>
<H2>Y este el título 2</H2>
<H3 ALIGN=center>Y este el título 3 centrado</H3>
<H4><P>Y este es un título<BR>formado por varias líneas<P>Y por varios párrafos</H4>

Imagen2.png

Ejemplo de Etiquetas para estructurar el texto Párrafos

<P>Aquí comienza un párrafo…
que termina en la misma línea.
<P>Sin embargo este párrafo…<BR>termina en otra línea.
<P ALIGN=left>Este párrafo va a la izquierda…
<P ALIGN=right>Este a la derecha…
<P ALIGN=center><BR><BR>Y este centrado y separado…

Imagen3.png

Caracteres especiales

Caracter Código
< &lt;
" &quot;
Ñ &Ntilde;
> &gt;
á &aacute;
ú &uacute;
& &amp;
é &eacute;
Á &Aacute;
@ &copy;
# &#35;
í &iacute;
ñ &ntilde;
espacio no divisible &nbsp;

La Etiqueta <body> </body>

Todo el texto, las imágenes y el formato visibles al usuario deben encontrarse entre las etiquetas

<body>…</body>. Esta etiqueta cuenta con los siguientes atributos:

* Bgcolor define el color de fondo de la página
* Text define el color del texto de la página
* Link define el color de los vínculos en la página
* Alink define el color del vínculo actual o activado en la página
* Vlink define el color del vínculo ya visitado
* Background define el archivo gráfico que será desplegado como fondo
* Bgsound define el archivo de audio que se tocará en la página.
* Bgproperties define el movimiento vertical del fondo.

Hiperenlaces entre secciones de la misma página HTML

Enlace desde una página a una sección del mismo documento.

  • Primero creamos la referencia:
    • <A HREF= “#A1” > Autor1 </A>
  • A continuación creamos el anclaje en el mismo documento:
    • <A NAME= “A1” > Autor1 </A>

Por: Omar E. Arcia y Yariela M. Chang.

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License