Título

domingo, 1 de abril de 2012

Manual básico de HTML (trabajo hecho en mis épocas de Secundario)


MANUAL BÁSICO DE HTML

Estructura básica:

<HTML>
<HEAD>

</HEAD>
<BODY>

</BODY>
</HTML>

Elementos llenos: son los que se “cierran” con </>. Ejemplo: <TITLE></TITLE>.
Elementos vacíos: son los que NO se “cierran”. Ejemplo: <HR>.

Si el elemento tiene atributos, se coloca de la siguiente manera:

<ELEMENTO atributo1 atributo2=numérico atributo3=”alfanumérico”>

Para utilizar los signos < ó > como texto, deberemos usar &lt (<) y &gt (>).

Comentarios: para colocar comentarios, utilizamos <!-- y --!>.

Elementos de <HEAD>:

<TITLE></TITLE> Acá se coloca el título. Es de uso obligatorio. Abre y cierra.

<META> Nos permite especificar cada cuánto tiempo se recargará la página, y ajustar otros parámetros. Sólo abre. Ej: <META HTTP-EQUIV=”Refresh” CONTENT=”10”>.

Visualizar tildes y “Ñ”

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">.

Separadores de Bloques de Texto:

<P></P> Es utilizado para separar párrafos. Admite el atributo ALIGN.
ALIGN admite los valores LEFT, RIGHT y CENTER.
Ejemplo: <P ALIGN=LEFT> Párrafo </P>.

<BR> Indica un salto de línea.

<HR> Dibuja una línea horizontal. Cuenta con los atributos NOSHADE, WIDTH y SIZE.
Ejemplo: <HR NOSHADE WIDTH=400 SIZE=4>.

<PRE></PRE> Respeta el formato con el que escribimos el texto, y lo representa “tal cuál”.

<CENTER></CENTER> Centra el contenido especificado.


Tipos de Letra:

<Hn></Hn>n” puede ser un número del 1 (más grande) al 6 (más chico). Se utiliza para escribir encabezamientos. Se inserta un salto de párrafo automáticamente.

<FONT></FONT> Tamaño, color y tipo de letra.
SIZE Tamaño (1-7).
COLOR Color.
FACE Tipo de letra.
<BASEFONT> Cambia el tamaño por defecto.
SIZE Tamaño (1-7).

Estilos de Caracteres:

<b></b> Negrita.

<i></i> Cursiva.

<u></u> Subrayado.

<strike></strike> Tachado.

<sup></sup> Superíndice.

<sub></sub> Subíndice.

Colores:

Color del texto

FONT + COLOR =. Ej: <FONT COLOR=”red”> Texto </FONT>.

Color del entorno (A diferencia del anterior, se aplica luego de <BODY)

BGCOLOR Color de fondo. Ej: <BODY BGCOLOR=”#C0C0C0”>.

BACKGROUND Utilizar como fondo una imagen residente en el servidor, o un archivo local. Ej: <BODY BACKGROUND=”imagen.jpg”>.

TEXT Color de texto estándar (sin enlaces). Ej: <BODY TEXT=”darkblue”>.

LINK Color de enlace aún no visitado. Ej: <BODY LINK=”blue”>.

ALINK Color del enlace al hacer clic. Ej: <BODY ALINK=”red”>.

VLINK Color del enlace visitado. Ej: <BODY VLINK=”yellow”>.


Imágenes:

IMG Incluir una imagen en el documento. Ej: <IMG SRC=”dirección_URL_de_la_imagen”>.

Hiperenlaces:

<A></A> Define enlaces hipertextuales de la Web.
NAME
HREF Define el ancla de partida hacia un enlace interno o externo. Ej: <A HREF=”URL_de_destino”> Zona a aplicar el hiperenlace </A>.
TARGET

Listas (Estructura el texto de forma más clara):

<Li> Es común a las listas regulares. Ej:

<BODY>
<Li> Hola 1
<Li> Hola 2
<Li> Hola 3
</BODY>

<UL></UL> Genera listas no ordenadas.
TYPE=DISC (Por defecto).
TYPE=CIRCLE
TYPE=SQUARE

<UL TYPE="SQUARE">
<Li> Hola 1
<Li> Hola 2
<Li> Hola 3
</UL>

<OL></OL> Se utiliza para una lista ordenada o numerada. Cada marca <Li> incrementará el nro. visualizado delante del elemento de la lista.
TYPE=1 (Por defecto) Para números.
TYPE=A Para letras mayúsculas.
TYPE=a Para letras minúsculas.
TYPE=I Numeración romana en mayúsculas.
TYPE=i Numeración romana en minúsculas.

<OL TYPE=a>
<Li> Hola 1
<Li> Hola 2
<Li> Hola 3
</OL>


Tablas:

<TABLE BORDER=1></TABLE> Marca de inicio de tabla.
<TR></TR> Una línea.
VALIGN Alineación de texto en sentido vertical, dentro de la celda.
TOP
BOTTOM
MIDDLE
ALIGN Alineación de texto en sentido horizontal, dentro de la celda.
RIGHT
CENTER
LEFT
<TD></TD> Una celda.
VALIGN Alineación vertical de una celda específica.
TOP
BOTTOM
MIDDLE
ALIGN Alineación horizontal de una celda específica.
RIGHT
CENTER
LEFT
COLSPAN Define una celda con una anchura múltiplo de la columna básica.
ROWSPAN Define una celda con una anchura múltiplo de la fila básica.
NOWRAP Obliga al navegador a inscribir todo el texto de la celda en una sola línea.

No hay comentarios:

Publicar un comentario en la entrada