Guía de HTML- Tags

Envia tus archivos, resúmenes, monografías, etc.

Guía de HTML- Tags:

Guia de ejercicios. Tema: Formas fisicas y quimicas de expresarc:

Guía de Ejercicios Radiactividad: Guía de Ejercicios Radiactividad

Enlaces externos relacionados con Guía HTML- Tags

<!-- ... >

Para incluir comentarios en un documento HTML que serán ignorados por el Browser estos deben estar entre "<!--" y ">". Los comentarios no se pueden anidar.

Ejemplo:

<HEAD>

<TITLE>Guide: Recommended Usage</TITLE>

</HEAD>

<A...>...</A>

El elemento Anchor se utiliza para definir un hipervínculo con otro hipertexto. (a través de este Tag se define un "salto" desde una página de web a otra página o a otro sector de la misma)

Este tag tiene muchos atributos, pero siempre tiene que tener el atributo href o name.

href="<url>"

Si el atributo href existe, todo lo que se encuentre entre el tag <a> y </a> se transforma en hipertexto^[1]. Si el lector de la página WEB selecciona este hipertexto, este se mueve a otro documento u otra parte del mismo documento.

La dirección (URL) a donde se iría seleccionado el hipertexto se define en este atributo.

Ej:

Vea <A HREF= "http://www.cnba.uba.ar/" > La Página del Colegio </A> para m&aacute ;s información.

En este ejemplo, seleccionando "La Página del colegio" lleva al lector hasta la portada principal de nuestra página WEB.

Con el atributo href con la forma href="#identificador" se hace referencia a otro tag <a> dentro de ese mismo documento (saltos dentro del mismo documento)

name=<url>

Si está presente, el atributo name permite definir el destino de un hipervínculo. El valor del atributo name puede ser cualquier "string" o cadena de caracteres pero debe ser único en el documento (no se debe repetir).

Ej:

es un ejemplo de...

Un ejemplo de esto es <A HREF=#coffee>coffee</A>.

Otro documento puede hacer una referencia explícita a este tag poniendo el identificador después de la dirección (URL) separado por el signo numeral "#"

title

El atributo TITLE es solo informativo, si se encuentra presente, este atributo debe proveer el título del documento al que se quiere llegar con el atributo href.

Este atributo es útil para - por lo menos - dos cosas. El browser puede mostrar el título del documento antes de traerlo, por ejemplo como una nota marginal (netscape) o como una pequeña caja sobre el hipertexto cuando el mouse esta sobre él (Microsoft Internet Explorer). La otra razón es para ver a donde nos llevan las imágenes.

<Address>

Con el tag address se puede formatear información referida a una dirección de manera estándar entre los browsers. Típicamente, "se renderea" como letra tipo itálica

Ej:

Newsletter editor<BR>

J.R. Brown<BR>

JimquickPost News, Jumquick, CT 01234<BR>

Tel (123) 456 7890

</ADDRESS>

Lo que produce :

Newsletter editor

J.R. Brown

JimquickPost News, Jumquick, CT 01234

Tel (123) 456 7890

En el browser.

<B>

El tag Bold define que el texto que se encuentra dentro suyo (entre el <b> y el </b> debe mostrarse en el browser con negritas

Ej:

El gabinete de <b>informática</b> tiene 2 servers de <b>archivos</b>, 1 server de <b>correo</b> y otro server de <b>web</b>.

En el browser debería mostrar algo así :

El gabinete de informática tiene 2 servers de archivos, 1 server de correo y otro server de web.

<BASE...>

El elemento base permite que se "recuerde" el URL del documento mismo en aquellas situaciones en las que el documento se puede "salir de contexto". El URL de los documentos puede estar en forma relativa desde esta dirección "base".

Donde la dirección de base no se especifica, el browser utiliza como dirección de "base" el URL actual^[2] para acceder a los hipervínculos.

El elemento BASE tiene un atributo, href que identifica el URL.

<BASEFONT SIZE...>

Este tag es un agregado de netscape que se utiliza para especificar el tamaño en que se basa el tag <FONT SIZE>. Por omisión tiene un valor de 3 y puede tomar cualquier valor entre 1 y 7.

Ej:

<BLINK>...</BLINK>

Otro tag agregado por netscape, se utiliza para hacer parpadear el texto que se encuentra en él.

Ej:

Este texto no parpadea <BLINK> pero este texto si lo hace !</BLINK> aunque este tampoco.

<BLOCKQUOTE>...</BLOCKQUOTE>

Este elemento se utiliza para resaltar citas textuales o texto extraído de otro lado. Típicamente se renderea con una tabulación extra y con letra tipo itálica, además de un salto de párrafo antes y después del tag.

Ej:

De un libro de latín sacamos la siguiente frase:<BLOCKQUOTE>Dixi, iudices, multa signa fuisse apud omnes siculos, ego idem confirmo nunc ne unum quidem esse<p> Ciceronis</BLOCKQUOTE> y procedemos a analizarla....

Se visualizaría como :

De un libro de latín sacamos la siguiente frase :

Dixi, iudices, multa signa fuisse apud omnes

siculos, ego idem confirmo nunc en unum

quidem esse.

Ciceronis.

y procedemos a analizarla....

<BODY...> ...</BODY>

El cuerpo de un documento HTML contiene todo el texto y las imágenes que conforman el documento junto con todos los elementos que controlan y formatean la página:

El formato es:

<BODY>

Acá iría el documento

</BODY>

El elemento <BODY> y </BODY> se requiere para poder visualizar el documento.

Es posible controlar el fondo del documento con el atributo background.

background="<url>"

Este atributo especifica un URL que apunta a una imagen que se utiliza para poner en el "fondo" del documento

Ej:

</BODY>

<BR>

Este tag define un "corte de línea" en el documento. Quiere decir que después del tag se visualizaría el texto en una nueva línea.

Ej:

<p>Este es el primer párrafo<BR> este es el segundo

Se visualizaría así :

Este es el primer párrafo

este es el segundo

<CAPTION...>...</CAPTION>

Representa a la cabecera de una tabla y debe utilizarse dentro del tag <TABLE>

Acepta un atributo de alineación de texto :

Align= top | botton

top:

Es el valor por defecto, especifica que la cabecera de la tabla se encontrará sobre la misma.

botton:

La cabecera se encuentra después de la tabla.

La cabecera de la tabla siempre se encuentran centradas horizontalmente respecto de la tabla y pueden cortarse y ocupar más de una línea.

<CENTER>...</CENTER>

Todas las líneas te texto y gráficos que se encuentren dentro del <CENTER> y </CENTER> aparecerán centradas respecto de la página web.

Ej:

<CENTER>Este texto est&aacute ; centrado</CENTER>

Se ve así :

Este texto está centrado

<CITE>...</CITE>

Este elemento se utiliza para resaltar una cita textual, típicamente se visualiza en itálicas.

Ej:

Como dijo el preceptor:<CITE> No se debe jugar al futbol en el claustro de botánica</CITE>. Aunque todos lo hacen...

Se mostraría así :

Como dijo el preceptor: No se debe jugar al futbol en el claustro de botánica. Aunque todos lo hacen...

<CODE>...</CODE>

Se utiliza para formatear texto como monoespacio (bien entendible) se utiliza cuando se quiere que algo se lea bien (por ejemplo el fuente de un programa)

<DD>

Se utiliza para determinar definiciones en una lista de definiciones (ver <DL>)

<DIR>

Se utiliza para definir una lista de directorio que puede contener hasta 20 caracteres cada entrada. Los ítems en esta lista se alinean en columnas.

Este tag debe comenzar con <DIR> y debe estar inmediatamente seguido por el elemento <LI>

Ej:

<DIR>

<LI>A-H<LI>I-M

<LI>M-R<LI>S-Z

</DIR>

Y se visualizaría así:

• A-H

• I-M

• M-R

• S-Z

<DL>...</DL>

Se utiliza para definir una lista de términos y sus definiciones (definition list)

Ej:

<DL>

<DT>Término1<DD> Definici&oacute ;n 1

<DT>Término2<DD> Definici&oacute ;n 2

<DT>Término3<DD> Definici&oacute ;n 3

<DT>Término4<DD> Definici&oacute ;n 4

</DL>

Se mostraría así :

Término1

Definición 1

Término2

Definición 2

Término3

Definición 3

Término4

Definición 4

COMPACT

Se utiliza para crear una lista compacta utilizando el mismo ejemplo eta se visualizaría:

Término1 Definición 1

Término2 Definición 2

Término3 Definición 3

Término4 Definición 4

<DT>

Se utiliza para definir los términos de una lista de definiciones. (Ver <DL> )

<EM>...</EM>

Se utiliza para dar énfasis al texto. Típicamente se visualiza como itálicas.

Ej:

El elemento<EM>Emphasis</EM. Típicamente se renderea como itálicas.

Mostraría :

El elemento Emphasis. Típicamente se renderea como itálicas.

<FONT ...> ...</FONT>

A partir de Netscape 1.0 y posteriores, se soportan diferentes cuerpos (tamaños de letra). Y la posibilidad de mostrar el texto en diferentes colores.

Size=<valor>

Define el tamaño del texto. Toma un valor entre 1 y 7.

Ej:

<FONT SIZE=1>Letra chiquitita </FONT><FONT SIZE=7> Letra Grandota </FONT> Letra normal. (base font)

se mostraría así :

Letra chiquitita Letra Grandota� Letra

normal. (base font)

COLOR=#<3 números hexadecimales>

Define el color del texto.

Ej:

<FONT COLOR=#0000ff> Texto en azul</FONT>

Mostraría el texto en azul.

<FORM...>...</FORM>

Se utiliza para delimitar un formulario para enviar datos al server web.

Tiene diferentes parámetros :

ACTION="<url>"

Especifica el programa en el server que procesaría los datos que se le envíen desde el browser.

METHOD= post | get

Selecciona el protocolo de transferencia de los datos al server

GET

Los datos se dejan en la variable de entorno QUERY_STRING

POST

Los datos de dejan en stdin.

<H1>...</H1>

HTML define seis niveles de títulos. Un tag titulo incluye todos los cambios al tipo de letra, párrafo, cortes de línea antes y después del mismo y los espacios en blanco que sean necesarios para visualizar el título.

El nivel más alto de títulos es el <h1> seguido por el <h2>.... hasta el <h6>

Ej:

<H1>Esto es un título</H1>Esto es texto común

Se visualizaría así :

Esto es un título

Esto es texto común

<H2>...</H2>

Segundo nivel de títulos, se visualiza un poco mas pequeño que el <H1>

Ej:

<H2>Esto es un título</H2>Esto es texto común

Se visualizaría así :

Esto es un título

Esto es texto común

<H3>...</H3>

Tercer nivel de títulos, se visualiza un poco mas pequeño que el <H2>

Ej:

<H3>Esto es un título</H3>Esto es texto común

Se visualizaría así :

Esto es un título

Esto es texto común

<H4>...</H4>

Cuarto nivel de títulos, se visualiza un poco mas pequeño que el <H3>

Ej:

<H4>Esto es un título</H4>Esto es texto común

Se visualizaría así :

Esto es un título

Esto es texto común

<H5>...</H5>

Quinto nivel de títulos, se visualiza un poco mas pequeño que el <H4>

Ej:

<H5>Esto es un título</H5>Esto es texto común

Se visualizaría así :

Esto es un título

Esto es texto común

<H6>...</H6>

Sexto nivel de títulos, se visualiza un poco mas pequeño que el <H5>

Ej:

<H6>Esto es un título</H6>Esto es texto común

Se visualizaría así :

Esto es un título

Esto es texto común

<HEAD>...</HEAD>

El encabezado de un documento HTML es una colección sin un orden establecido de información sobre el documento mismo.

Por lo menos se requiere el tag <TITLE> dentro de la sección <HEAD> de un documento HTML.

El tag <HEAD> no tiene influencia directa sobre la visualización del documento HTML .

Los siguientes elementos pueden incluirse dentro de la sección <HEAD>

<BASE>	Permite ingresar la dirección (URL) del documento <HTML>
<ISINDEX>	Permite que se pueda buscar por teclado dentro del documento
<LINK>	Indica relaciones entre documentos
<NEXTID>	Crea un identificador único para el documento
<TITLE>	Especifica el título del documento
<META>	Permite ingresar información Cliente/Servidor

El tag <TITLE> es el único requerido dentro de la sección <HEAD>

<HR...>

Define una línea divisora entre secciones de un documento.

WHITH=<valor>

Con este atributo se indica cuan grande es la línea que queremos visualizar.

Ej:

<ADDRESS> Bolívar 263</ADDRESS>

<HR>

Lo que mostraría:

Bolívar 263

<HTML>... </HTML>

Este tag identifica que el documento que contiene entre <HTML> y </HTML> es un documento HTML

Este tag puede contener solamente a los tags <HEAD> y <BODY> (las dos partes de un documento HTML).

<I>...</I>

Este tag indica que todo lo de se encuentre dentro de él debe visualizarse como itálicas

Ej:

Todo lo esté entre este <I>elemento</I> debe visualizarse como <I> itálicas</I>

Se visualizaría así:

Todo lo esté entre este elemento debe visualizarse como itálicas

<IMG...>

Este tag se utiliza para incluir imágenes en un documento HTML. Los browser que no pueden visualizar imágenes (unos pocos como el Lynx de Unix) ignoran este tag salvo que se encuentre el atributo opción ALT.

Este tag es un de los pocos que no se cierra (no tiene el </IMG>) ya que sirve para insertar un gráfico.

Tiene los siguientes atributos:

ALIGN= top | middle | botton

Este atributo acepta los valores TOP, MIDDLE o BOTTON que indica el lugar donde la próxima línea de texto se visualizará respecto del gráfico TOP (en la parte superior) , MIDDLE (en el centro), BOTTON (en la parte inferior del gráfico).

ALT= "<texto alternativo>"

Texto opcional como alternativa para aquellos browsers que no soportan gráficos.

BORDER=<valor>

Define si se dibuja un borde para el gráfico con BORDER=0 no se dibuja ningún borde.

ISMAP

Este elemento especifica que el gráfico actual es un mapa (Depende de donde se clickee se hará un salto a otro documento)

SRC="<url>"

El valor de este atributo indica el URL del gráfico a insertar. La sintaxis es la misma que en el atributo HREF del tag <A>. Este atributo es el único que debe estar presente para poder visualizar el gráfico.

Ej:

<IMG SRC="loro.gif" BORDER=0 ALIGN=TOP> Esto es un loro con el texto en la parte superior

Lo que mostraría :

Esto es un loro con el texto en la parte superior

<IMG SRC="loro.gif" BORDER=0 ALIGN=MIDDLE> Esto es un loro con el texto en la parte central

Lo que mostraría :

Esto es un loro con el texto en la parte central

<IMG SRC="loro.gif" BORDER=0 ALIGN=BOTTON> Esto es un loro con el texto en la parte inferior

Lo que mostraría :

Esto es un loro con el texto en la parte inferior

<INPUT>

Representa un campo dentro del formulario creado con el tag <FORM>. Este tag debe estar dentro del <FORM>.

Tiene los siguientes atributos :

ALIGN= left | center | right

Alineación vertical de la imagen. Se utiliza solamente si el atributo TYPE es igual a IMAGE. Los Valores posibles son los mismos que en el atributo ALIGN del tag <IMG> (VER <IMG>).

CHECKED

Indica que una casilla de selección o botón de radio se encuentra seleccionada

Las casillas de selección o los botones de radio no regresan el par nombre=valor cuando se envían al server.

MAXLENGTH=<valor>

Indica el máximo número de caracteres que pueden ser ingresados en la casilla de selección. Por defecto no se encuentra limitado el número de caracteres.

NAME=<nombre>

Nombre simbólico que se utiliza cuando se envían los resultados al server.

SIZE=<valor>

Define cuan grande es la caja de texto que se visualizará en el server

Ej:

(Casilla con un ancho de 24 caracteres)

SRC="<url>":

Un URL especificando una imagen. (se utiliza solamente con el atributo TYPE=IMAGE)

TYPE=<valor alfanumérico>:

Define el tipo de dato que acepta el campo. Por defecto es texto libre.

Hay varios tipos disponibles :

� CHECKBOX : Se utiliza para tipos booleanos (aquellos que solo aceptan dos posibles valores : verdadero o falso, uno o cero, etc.)

� HIDDEN : No se visualiza campo alguno en el browser, pero el contenido del campo se envía al server cuando se manda la información al server. Este valor debe ser utilizado para transmitir información sobre la interacción Cliente/Servidor.

� IMAGE : Un campo IMAGE define una imagen que se puede clickear con un mouse y causando que el formulario sea enviado al server inmediatamente. La imagen se define con el atributo SRC.

� PASSWORD : Se utiliza para pasar información como texto, pero que no se visualiza en el browser

� RADIO : Se utiliza para atributos que aceptan un solo valor frente a una serie de alternativas.

� RESET : Define un botón que cuando se lo presiona borra todo el formulario.

� SUBMIT : Define otro botón que cuando se lo presiona envía todo el formulario al server. Se puede utilizar el atributo VALUE para poner un texto dentro del botón

� TEXT : Se utiliza para especificar que lo que se va a ingresar es texto.

� VALUE : Se muestra el valor inicial del campo.

Ej:

Véase el URL http://www.cnba.uba.ar/hist/exalum/

<ISINDEX>

Este elemento le especifica al browser que el documento es un índice y se pueden hacer búsquedas de texto en él

<KBD>...</KBD>

El elemento Keyboard indica que el texto que se encuentre en él se deberá visualizar de una forma especial y que demuestre que ese texto se ha ingresado por teclado. Se utiliza comúnmente en un manual de instrucciones.

Ej:

El texto dentro del elemento <KBD>KBD típicamente </KBD>se debe mostrar como texto monoespacio.

El texto dentro del elemento KBD típicamente se debe mostrar como texto monoespacio.

Se vería:

<LI>

List Item, Define un ítem dentro de una lista.

Ver <DIR>

<MENU>...</MENU>

Define una lista de menú, que típicamente de mostrará uno por línea.

Este elemento comienza con <MENU> e inmediatamente debe ser seguido por el elemento <LI> (List Item)

Ej:

<MENU>

<LI> Primer elemento de la lista.

<LI> Segundo elemento de la lista.

<LI> Tercer elemento de la lista.

<LI> Cuarto elemento de la lista.

</MENU>

Mostraría :

• Primer elemento de la lista.

• Segundo elemento de la lista.

• Tercer elemento de la lista.

• Cuarto elemento de la lista.

<OL>...</OL>

El elemento Ordered List (Lista con orden) representa un número de ítems ordenados por su importancia.

El tag <OL> debe ser inmediatamente seguido por el tag <LI>

Ej:

<H2>Pasos a seguir :</H2>

<OL>

<LI> Agarre la lata.

<LI> Abra la tapita.

<LI> Beba su contenido

<LI> Disfrute de su Coca-Cola. !

</OL>

Lo que mostraría :

Pasos a seguir :

1. Agarre la lata.

2. Abra la tapita.

3. Beba su contenido

4. Disfrute de su Coca-Cola. !

<OPTION>

Se utiliza solamente dentro del tag <FORM> y dentro del tag <SELECT>.

Representa una opción a elegir dentro una lista de posibles opciones.

Tiene los siguientes atributos :

SELECTED

Indica que esa opción es la que se encuentra inicialmente seleccionada.

VALUE=<valor>

Cuando se encuentra presente indica el valor a ser enviado al server si esa opción es la elegida.

Ej:

<OPTION> Primer Capítulo

<OPTION> Segundo Capítulo

</SELECT>

<P...>

Define que todo el texto que se encuentra hasta un nuevo tag <P> debe visualizarse como si fuese un párrafo.

Tiene el siguiente atributo :

ALIGN= left | center | right

Define la posición del párrafo respecto de la pantalla del browser.

Su valor puede ser :

� RIGHT : El texto se alinea a la derecha.

� CENTER : El texto permanece centrado.

� LEFT : El texto se alinea a la izquierda.

<PRE>...</PRE>

Se visualiza como "Texto Preformateado" con una font de ancho fijo ( sin kerning). Se utiliza para mostrar texto como se visualizaría en la pantalla de una computadora.

<SELECT...>...</SELECT>

Este tag permite al usuario elegir una alternativa desde una serie de alternativas ya establecidas. Se renderea como un combo box

MULTIPLE=<valor>

Se utiliza para poder elegir más de una alternativa.

NAME=<nombre>

Especifica el nombre de la variable que se le enviará al server.

EJ:

<OPTION>Vanilla

<OPTION>Strawberry

<OPTION>Rum and Raisin

<OPTION>Peach and Orange

</SELECT>

Se visualizaría:

<STRONG>...</STRONG>

Se visualiza como tipografía enfatizada típicamente rendereada como negrita.

Ej:

Las instrucciones <STRONG>deben</STRONG> ser leídas

Lo que produce :

Las instrucciones deben ser leídas

<TABLE ...>...</TABLE>

Este tag es el encargado de contener todos los elementos relativos a la visualización de tablas. Por defecto, las tablas formadas no tienen borde pero se le puede especificar uno con el parámetro BORDER.

BORDER=<valor>

Hace que se visualice el borde de una tabla, con un número que indica el grosor del borde (0 indica sin borde).

CELLSPACING=<valor>

Indica el espaciado entre las celdas de una tabla, por defecto es un espaciado de 2.

CELLPADDING=<valor>

Especifica el espacio que se deja entre el comienzo de una celda y los contenidos de la misma.

WIDTH=<valor>

Indica el ancho de la tabla medido en pixeles o en un porcentaje del ancho de la página WIDTH="100%" indicaría una tabla que ocupa todo el ancho de la página web.

<TD...>...</TD>

Especifica una celda (DATA) dentro de una tabla.

Este elemento debe aparecer dentro del <TR> o fila de una tabla.

ALIGN= left | center | right

Hace que el contenido de la celda se visualice a la izquierda, centrado o a la derecha.

VALIGN= top | middle | botton

Centra el contenido de la celda en la parte superior, media o inferior de la celda.

NOWRAP

Hace que no se corte el texto de la celda si no entra toda en la página de web.

COLSPAN

Especifica cuantas celdas hacia abajo debe medir la celda actual.

ROWSPAN

Especifica cuantas celdas hacia la derecha va a medir la celda actual.

<TEXTAREA...>...</TEXTAREA>

Este elemento tiene que utilizarse dentro del tag FORM. Permite ingresar al server más de una línea de texto al server.

NAME=<nombre>

El nombre que tendrá la variable cuando se mande al server.

ROWS=<valor>

Especifica la cantidad de filas que tiene que tener la caja de texto a ingresar.

COLS=<valor>

Especifica la cantidad de columnas que tendrá la caja de texto.

<TH...>...</TH>

Define un encabezado dentro de una tabla. Celdas de encabezado actúan igual que celdas comunes con la excepción de que se visualizan en negrita y centradas.

Tiene los mismos atributos que el tag <TD>

VALIGN

NOWRAP

COLSPAN

ROWSPAN

<TITLE>...</TITLE>

Define un título para un documento. Debe estar dentro de la sección <HEAD> de un documento HTML.

<TR...>...</TR>

Define una fila dentro de una tabla. También define cuantas filas va a tener la tabla (la cantidad de tags <TR> ).

<TT>...</TT>

Define una visualización como si fuese escrito en máquina de escribir.

<U>...</U>

Define que todo lo que esté entre <U> y </U> se deberá visualizar subrayado.

Ej:

Esto se verá <U>subrayado</U>

Esto se verá subrayado

<UL>...</UL>

El elemento "Lista sin orden" define una lista separada por "bullets".

Ej:

<UL>

<LI> Primer elemento

<LI> Segundo elemento

<LI> Tercer Elemento

<LI> Cuarto Elemento

</UL>

Lo que mostraría :

• Primer elemento

• Segundo elemento

• Tercer Elemento

• Cuarto Elemento

<VAR>...</VAR>

Define que el texto que se encuentre dentro suyo debe tratarse como variable. Se renderea con itálicas.

<WBR>

Es una variedad rara del elemento <BR>.

Define que si se debe cortar la línea de texto se debe cortar donde aparece el tag aunque si no es necesario cortar el texto no se lo hará.

^[1] Hipertexto todo texto o imagen que cuando se clickea con el mouse en ella, se produce un salto en el documento a otra sección u otro documento.

^[2] El URL actual es el que uno especifica en la caja de texto "location" del browser.

Guía de HTML- Tags

Votar

Comentarios de los usuarios

Boletín de Novedades

Acceso rápido