etiquetas de html

8
<Etiquetas de HTML> Que son las etiquetas en HTML, su uso, lista de las principales Fernando Zapata 28/10/2013

Upload: miguel-zapata

Post on 26-Jun-2015

375 views

Category:

Design


1 download

DESCRIPTION

Principales etiquetas HTML

TRANSCRIPT

Page 1: Etiquetas de html

<Etiquetas

de HTML> Que son las etiquetas en HTML, su uso, lista de las principales

Fernando Zapata 28/10/2013

Page 2: Etiquetas de html

Etiqueta (lenguaje de marcado)

A menudo se emplea la palabra inglesa (tag) a pesar de que «etiqueta» o «baliza» son

perfectamente adecuadas. Con la llegada de la World Wide Web ha habido una invasión de

tags. La Web se basa en el HTML, o «lenguaje de marcado de hipertexto», que está basado en

el uso de etiquetas. Las etiquetas (entre otras muchas cosas) le dicen al programa visualizador

de páginas web (o navegador) en qué juego de caracteres está la página, de qué tipo es cada

uno de los fragmentos de texto que contiene (por ejemplo, encabezamiento, texto normal,

etc.), si están alineados a un lado o centrados, en qué tipo de letra está el texto (cursiva,

negrita, etc.), si hay tablas, de qué anchura son etc. Dicho de otro modo: las balizas dan al

navegador las instrucciones necesarias para que presente la página en pantalla.

Si se observa el código de una página web (sencillamente escogiendo en el menú del

navegador «Ver -> Código fuente»), se encontrará con los paréntesis angulares < > (los

símbolos "menor que" y "mayor que", que enmarcan habitualmente la etiqueta de apertura o

inicio, y </ >, que acotan la etiqueta de cierre o final). Lo que hay entre las etiquetas suele ser

el texto que se puede ver directamente en pantalla. Las etiquetas simplemente dan las

órdenes que indican:

Cómo se van a visualizar los elementos destinados a ser visibles en pantalla y cómo se

visualizarán

Cómo actuarán en el mismo documento los elementos no destinados a ser visibles en

pantalla, así como la manera en que actuarán en relación con otros documentos

Ejemplos de balizas html destinadas a interactuar con otros documentos sin ser necesariamente visibles en pantalla son, entre otros ejemplos posibles, las llamadas «metabalizas» (o metatags) que en lenguaje HTML pueden incluir palabras clave para que la página web en las que están incluidas sea referenciada con mayor rapidez y pertinencia por los motores de búsqueda.

Listado de todos los elementos HTML

Véase el siguiente ejemplo:

<etiqueta1> <etiqueta2 atributo1="hola" atributo2="mundo"> </etiqueta2> <etiqueta3 atributo1="domin"/> </etiqueta1>

Principales

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>

Page 3: Etiquetas de html

<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>

Page 4: Etiquetas de html

<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>

Page 5: Etiquetas de html

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

Page 6: Etiquetas de html

Tag (Etiqueta) Descripción

<!--...--> Define un comentario

<!DOCTYPE> Define el tipo de documento

<a> Define un hiperenlace

<abbr> Define una abreviatura

<acronym> No suportado en HTML5. Define un acronimo

<address> Define la información de contacto para el autor/propietaria de un documento

<applet> No suportado en HTML5. Depreciado en HTML 4.01. Defins una applet embebida

<area> Define un área dentro de un mapa de imagen

<article> Define un artículo

<aside> Define un contenido aparte del contenido de la página

<audio> Define un contenido de sonido

<b> Define texto en negrita

<base> Especifica el destino/URL base para todas las URLs relativas en un documento

<basefont> No soportado en HTML5. Depreciado en HTML 4.01. Especifica un color , medida y fuente por defecto para todo el texto en un documento

<bdi> Aisla parte de un texto que puede ser formateado en una dirección diferente que otro texto fuera de la etiqueta

<bdo> Sobrescribe la actual dirección del texto

<big> No suportado en HTML5. Define texto grande

<blockquote> Define una sección citada desde otra fuente

<body> Define el cuerpo del documento

<br> Define una rotura de línea simple

<canvas> Usado para dibujar gráficos, al vuelo, mediante scripting (generalmente JavaScript)

<caption> Define un título de tabla

<center> No suportado en HTML5. Depreciado en HTML 4.01. Define el texto centrado

<cite> Define el título de una obra

<code> Define una pieza de código informático

<col> Especifica la columna propiedades para cada columna dentro de un elemento <colgroup>

<colgroup> Especifica un grupo de una o más columnas en una tabla para formato

<command> Define un botón de comando que un usuario puede invocar

<datalist> Especifica una lista de opciones predefinidas para controles de entrada

<dd> Defina una descripción de un item en una lista de definiciones

<del> Defines text that has been deleted from a document

<details> Defines additional details that the user can view or hide

<dfn> Defines a definition term

<dialog> Defines a dialog box or window

<dir> Not supported in HTML5. Deprecated in HTML 4.01. Defines a directory list

<div> Defines a section in a document

<dl> Defines a definition list

Page 7: Etiquetas de html

<dt> Defines a term (an item) in a definition list

<em> Defines emphasized text

<embed> Defines a container for an external (non-HTML) application

<fieldset> Groups related elements in a form

<figcaption> Defines a caption for a <figure> element

<figure> Specifies self-contained content

<font> Not supported in HTML5. Deprecated in HTML 4.01. Defines font, colour, and size for text

<footer> Defines a footer for a document or section

<form> Defines an HTML form for user input

<frame> Not supported in HTML5. Defines a window (a frame) in a frameset

<frameset> Not supported in HTML5. Defines a set of frames

<h1> to <h6> Defines HTML headings

<head> Defines information about the document

<header> Defines a header for a document or section

<hgroup> Groups heading (<h1> to <h6>) elements

<hr> Defines a thematic change in the content

<html> Defines the root of an HTML document

<i> Defines a part of text in an alternate voice or mood

<iframe> Defines an inline frame

<img> Defines an image

<input> Defines an input control

<ins> Defines a text that has been inserted into a document

<kbd> Defines keyboard input

<keygen> Defines a key-pair generator field (for forms)

<label> Defines a label for an <input> element

<legend> Defines a caption for a <fieldset>, < figure>, or <details> element

<li> Defines a list item

<link> Defines the relationship between a document and an external resource (most used to link to style sheets)

<map> Defines a client-side image-map

<mark> Defines marked/highlighted text

<menu> Defines a list/menu of commands

<meta> Defines metadata about an HTML document

<meter> Defines a scalar measurement within a known range (a gauge)

<nav> Defines navigation links

<noframes> Not supported in HTML5. Defines an alternate content for users that do not support frames

<noscript> Defines an alternate content for users that do not support client-side scripts

<object> Defines an embedded object

<ol> Defines an ordered list

<optgroup> Defines a group of related options in a drop-down list

<option> Defines an option in a drop-down list

<output> Defines the result of a calculation

<p> Defines a paragraph

<param> Defines a parameter for an object

<pre> Defines pre-formatted text

Page 8: Etiquetas de html

<progress> Represents the progress of a task

<q> Defines a short quotation

<rp> Define qué mostrar en navegadores que no soportan carácteres ruby

<rt> Define una explicación/pronunciación de carácteres (para tipografía de Asia Oriental)

<ruby> Define un carácter ruby

<s> Define texto que ya no es correcto

<samp> Define una salida de ejemplo en un programa informático

<script> Define un guión (script)s en el lado-cliente

<section> Define una sección en un documento

<select> Define una lista desplegable1

<small> Define texto más pequeño

<source> Define múltiples recursos multimedia para los elementos multimedia (<video> y <audio>)

<span> Define una sección en un documento

<strike> No suportado en HTML5. Depreciado en HTML 4.01. Define techo tachado

<strong> Define un texto importante

<style> Define el estilo de la información para un documento

<sub> Define texto infrascrito

<summary> Define a visible heading for a <details> element

<sup> Define texto supraescrito

<table> Define una tabla

<tbody> Agrupa el contenid del cuerpo en una tabla

<td> Define una célda en una tabla

<textarea> Define un control de entra multi-línea (área de texto)

<tfoot> Agrupa el contenido del pie (footer) en una tabla

<th> Define una celda de encabezado en una tabla

<thead> Agrupa el contenido del encabezado en una tabla

<time> Define una fecha/hora

<title> Define el título de un documeto

<tr> Define una fila en una table

<track> Define pistas de texto para elementos multimedia (<video> y <audio>)

<tt> No suportado en HTML5. Define texto Teletipo

<u> Define un texto que puede ser estadísticamente diferente de un texto normal

<ul> Define una lista sin ordenar

<var> Define una variable

<video> Define un video o una película

<wbr> Define una posible ruptura de línea

BIBLIOGRAFIA

1. Etiquetas de HTML http://crismattweb.tripod.com/guiahtml/etiqueta.html

2. Etiquetas Basicas HTML ima.udg.edu/~dagush/cursohtml/etiquet1.htm