Hoy vamos a preparar desde cero un documento básico de HTML, es muy sencillo de realizar. Tambien sabremos el significado de algunas etiquetas y su función característica :3




Las páginas HTML se dividen en dos partes: la cabecera y el cuerpo. (head y body) 


 La cabecera incluye información sobre la propia página, como por ejemplo su título y su idioma y contiene todo lo que no se ve (con la única excepción del título de la página, que los navegadores muestran como título de sus ventanas). El cuerpo de la página incluye todos sus contenidos, como párrafos de texto e imágenes y contiene todo lo que el usuario ve en su pantalla y la propia cabecera.

 




He encontrado un sinfín de etiquetas y atributos que son las más utilizadas para las webs en sí. Espero que os sirvan de ayuda nwn

ETIQUETAS


Apertura

Acción

Atributos

Cierre

< !

Comentario.

Ninguno

-->

<A>

Hipervínculo.

HREF, NAME, REL, REV, TITLE

</A>

<ADDRESS>

Formato para dirección del autor.

Ninguno

</ADDRESS>

<BASE>

Url del autor; contexto del documento.

HREF

</BASE>

<BASEFONT SIZE>

Tamaño de la fuente base.

Ninguno

NO

<BGSOUND>

Sonido de fondo.

SRC, LOOP.

NO - Internet Explorer

<BIG>

Aumenta el tamaño.

Ninguno

</BIG>

<BLINK>

Hace parpadear el texto.

Ninguno

</BLINK> - Netscape

<BLOCKQUOTE>

Da formato con sangría a un párrafo

Ninguno

</BLOCKQUOTE>

<BODY>

Cuerpo del documento.

BGCOLOR, BACKGROUND, TEXT, LINK, VLINK, ALINK

</BODY>

<BR>

Retorno de línea.

CLEAR: Se utiliza en combinación con ALIGN de IMAGE.

NO

<CAPTION>

Posición de la leyenda en una tabla.

ALIGN: TOP/BOTTOM. Internet Explorer: LEFT, RIGHT, CENTER

</CAPTION>

<CENTER>

Centrar.

Ninguno

</CENTER>

<CITE>

Formato para citas en itálicas.

Ninguno

</CITE>

<CODE>

Formato en tipo código.

Ninguno

</CODE>

<DD>

Definiciones marcadas, para Lista de Definiciones <DL>.

Ninguno

NO

<DFN<

Formato en itálica.

Internet Explorer

</DFN<

<DIR>

Lista de directorio, con elementos marcados con <LI>.

Ninguno

</DIR>

<DL>

Lista de Definiciones, con términos marcados con <DT> y definiciones marcadas con <DD>.

Ninguno

</DL>

<DT>

Términos marcados, para Lista de Definiciones <DL>.

Ninguno

NO

<EM>

Formato enfatizado en itálica.

Ninguno

</EM>

<EMBED>

Sonido de Fondo.

SRC, WIDTH, HEIGHT, AUTOSTART, LOOP.

NO - Netscape

<FONT>

Definición de la fuente.

SIZE, COLOR. Internet Explorer: FACE.

</FONT>

<FORM>

Para ingreso de datos del usuario en un formulario.

ACTION, METHOD

</FORM>

<H1 ...H6>

Tamaño de letras del 1 al 6.

HTML 3.0: LEFT, CENTER, RIGHT

</H1 .../H6>

<HEAD>

Encabezamiento del documento.

BASE, TITLE, ISINDEX, NEXTID, META

</HEAD>

<HR>

Línea horizontal.

NOSHADE, SIZE, WIDTH, ALIGN. Internet Explorer: COLOR

NO

<HTML>

Al principio y al fin de todo documento.

HEAD, BODY

</HTML>

<I>

Itálica (Cursiva).

Ninguno

</I>

<IMG>

Cargar imágenes.

ALIGN, SRC, ALT, ISMAP, WIDTH, HEIGHT, VSPACE, HSPACE

NO

<INPUT>

Define un objeto de ingreso en un formulario.

TYPE, NAME, VALUE, SIZE, MAXLENGHT, ALIGN, SRC, CHECKED

</INPUT>

<ISINDEX>

Indica que existe un index en el server para el documento.

Netscape: PROMPT

NO

<ISMAP>

Activa la selección de imágenes para el usuario.

Ninguno

NO

<KBD>

Formato monoespaciado.

Ninguno

</KBD>

<LI>

Ítem de lista.

Netscape: VALUE, TYPE

NO

<LISTING>

Listados

Ninguno. Obsoleto.

</LISTING>

<LIT>

Literal. Como PRE, pero usa letra proporcional.

Ninguno

</LIT>

<MARQUEE>

Marquesina.

ALIGN, BEHAVIOR, BGCOLOR, DIRECTION, HEIGHT, WIDTH, HSPACE, VSPACE, LOOP, SCROLLAMOUNT, SCROLLDELAY.

</MARQUEE> - Internet Explorer

<MENU>

Lista menú.

Ninguno

</MENU>

<META>

Metainformación ubicada en HEAD.

EQUIV, CONTENT, NAME

NO

<NEXTID>

Es un parámetro que identifica al documento.

NO

NO

<NOBR>

Elimina los saltos de líneas.

Ninguno

NO

<OL>

Lista ordenada, con elementos marcados con <LI>.

TYPE, START, VALUE.

</OL>

<OPTION>

Opción de selección dentro de un formulario.

VALUE, SELECTED VALUE

NO

<P>

Retorno de línea, con un espacio.

Ninguno

NO

<P ALIGN>

Alineación de texto.

LEFT, CENTER, RIGHT

</P>

<PLAINTEXT>

Pasaje de texto plano.

Ninguno. Obsoleto.

</PLAINTEXT>

<PRE>

Visualiza el texto en su formato original.

WIDTH

</PRE>

<S>

Texto tachado.

Ninguno

</S>

<SAMP>

Formato tipo ejemplo.

Ninguno

</SAMP>

<SELECT>

Para selección de opciones dentro de un formulario.

NAME, SIZE, MULTIPLE

</SELECT>

<SMALL>

Disminuye el tamaño.

Ninguno

</SMALL>

<STRONG>

Formato enfatizado más fuerte que <EM>.

Ninguno

</STRONG>

<SUB>

Subíndice.

Ninguno

</SUB>

<SUP>

Superíndice.

Ninguno

</SUP>

<TABLE>

Tabla.

BORDER, CELLPADDING, CELLSPACING, HEIGTH, WIDTH. Internet Explorer: COLOR

</TABLE>

<TD>

Celdas de una fila en una tabla, dentro de <TR>.

ALIGN, VALIGN, NOWRAP, COLSPAN, ROWSPAN, HEIGTH, WIDTH

</TD>

<TEXTAREA>

Área para ingreso de texto dentro de un formulario.

NAME, ROWS, COLS.

</TEXTAREA>

<TH>

Título de Tabla.

ROWSPAN, COLSPAN, ALIGN, VALIGN, NOWRAP, HEIGHT, WIDTH

</TH>

<TITLE>

Título dentro de HEAD.

Ninguno

</TITLE>

<TR>

Fila de una Tabla.

ALIGN, VALIGN

</TR>

<TT>

Formato tipo máquina.

Ninguno

</TT>

<UL>

Lista no ordenada, con elementos marcados con <LI> .

COMPACT, TYPE

</UL>

<VAR>

Formato tipo variable.

Ninguno

</VAR>

<WBR>

Se usa con NOBR para una sección que deba ser separada.

Ninguno

NO

<XMP>

Similar a PRE.

Ninguno

</XMP>

ATRIBUTOS


Nombre

Etiqueta

Acción

Valor

HREF

Dirección del URL local o remoto.

href="www.hp.com"


LOOP

<BGSOUND>

Número de veces que se reproduce el archivo de sonido. Para permanente se usa INFINITE o -1.

loop=infinite

SRC

Nombre del archivo de sonido (Internet Explorer)

src="sonido.wav"

LOOP

<EMBED>

Número de veces que se reproduce el archivo de sonido. Para permanente se usa INFINITE o -1.

loop=-1

SRC

Nombre del archivo de sonido (con Crescendo)

src="sonido.mid"

SRC

<IMAGE>

Nombre del gráfico

src="imagen.gif"

ALT

Nombre que reemplaza a la imágen cuando ésta no puede ser cargada.

alt="Nombre de Imágen"

BGCOLOR

<BODY>

Color de fondo

bgcolor="#FFFFFF" (blanco)

BACKGROUND

Imágen de fondo

background="foto.gif"

TEXT

Color del texto

text="#000000" (negro)

LINK

Color de vínculo

link="#0000FF" (azul)

VLINK

Color de vínculo visitado

vlink="#FF0000" (rojo)

ALINK

Color de vínculo presionado

alink="#00FF00" (verde)

ALIGN

<CAPTION> dentro de <TABLE>

Colocar título arriba (TOP) o debajo (BOTTOM) de la tabla.

align=top

ALIGN

<H1..H6>, <P ALIGN>, <TD>, <TH>, <TR>, <DIV>,

Alinear el texto: LEFT, RIGHT, CENTER

align=center

ALIGN

<HR>

Alinear el texto: LEFT, RIGHT, CENTER

align=center

SIZE

Valor de la altura en pixels o porcentaje

size=3

WIDTH

Valor del ancho en pixels o porcentaje

width=50%

SIZE

<FONT>

Tamaño de la letra de 1 a 7

size=6

COLOR

Color de la letra

color="#000000" (negro)

FACE

Fuente del texto (Internet Explorer)

face="helv" (helvética)

HEIGHT

<EMBED>, <IMAGE>, <MARQUEE>, <TD>, <TH>

Valor de la altura en pixels o porcentaje

heigth=80

WIDTH

Valor del ancho en pixels o porcentaje

width=50%

BORDER

<TABLE>

Borde y ancho del borde en la tabla

border=5

CELLPADDING

Espacio entre el borde y el texto

cellpadding=10

CELLSPACING

Espacio entre las líneas interna y externa del borde

cellspacing=3

HEIGHT

Valor de la altura en pixels o porcentaje

heigth=80

WIDTH

Valor del ancho en pixels o porcentaje

width=50%

COLSPAN

<TD> dentro de <TABLE>

Expandir una celda varias columnas

colspan=4

ROWSPAN

Expandir una celda varias filas

rowspan=4






ラベル: