Etiquetas html
Click here to load reader
-
Upload
duglas-moreno -
Category
Education
-
view
3.107 -
download
1
description
Transcript of Etiquetas html
Etiquetas Básicas Referencia HTML
Etiquetas Básicas (Estructura HTML)
Etiquetas Atributos Valores Descripción
<HTML> - -
Inicio y final del
</HTML> documento html
<HEAD> - -
Información general del
</HEAD> documento html
<TITLE> Titulo del documento.
- - Visible en la barra del
</TITLE>
navegador
text
link Color Hexadecimal
alink
(ejemplo: #000000)
vlink
bgcolor
topmargin (IE)
Inicio y final del cuerpo
<BODY> leftmargin (IE) Tamaño en pixels
del documento. Lo que
marginheight (ejemplo: 10px)
</BODY>
se ve en el navegador.
marginwidth
background Archivo de imagen
bgproperties (IE) Fixed
Formato de Presentación
Etiquetas Atributos Valores Descripción
<B> - - Estilo Negrita
</B>
<I> - - Estilo Cursiva (italica)
</I>
<U> - - Estilo Subrayado
</U>
<S> - -
Estilo Tachado
</S> (Strike)
<SUB> - - Estilo Subíndice
</SUB>
<SUP> - - Estilo Superíndice
</SUP>
<TT> Estilo Anchura Fija
- - (mismo espacio cada
</TT>
letra)
face
Nombre de Fuente
(ejemplo: Arial)
<FONT> size
Tamaño (1-7) Formateo de la fuente.
</FONT> (ejemplo: 5) (BASEFONT)
color
Color Hexadecimal
(ejemplo: #000000)
<PRE> - -
Preformateado
</PRE> (tal y como se escribe)
<CENTER> - - Alineación centrada
</CENTER>
<BLINK> - - Intermitencia
</BLINK>
<MARQUEE> - - Marquesina
</MARQUEE>
Duglas Oswaldo Moreno Mendoza Página 1
Etiquetas Básicas Referencia HTML
Definición Estructural
Etiquetas Atributos Valores Descripción
<Hx> align left | center | right
Encabezados
</Hx> (x = nº entre 1 y 6)
left
<P> align
center Párrafo
</P> Right
justify
left
<DIV> align
center División, bloque
<DIV> Right
justify
<BR>
Clear left | right | all Salto de línea
(texto alrededor img.)
size
Ancho en píxel o %
(ej. 100px – 40%)
width
Alto en pixels
(ejemplo: 10px)
<HR>
Línea horizontal
align left | center | right
noshade -
<BLOCKQUOTE> - - Sangria (margenes)
</BLOCKQUOTE>
<BIG> - - Tamaño fuente mayor
</BIG>
<SMALL> - - Tamaño fuente menor
</SMALL>
<EM> - -
Estilo Énfasis
</EM> (Habitualmente Cursiva)
<STRONG> - -
Estilo Énfasis Fuerte
</STRONG> (Habitualmente Negrita)
<CITE> - -
Estilo Cita
</CITE> (Habitualmente Cursiva)
<ADRESS> - - Estilo Dirección
</ADRESS>
<ABBR> - - Estilo Abreviatura
</ABBR>
<ACRONYM> - - Estilo Acrónimo
</ACRONYM>
<CODE> - - Estilo Código
</CODE>
<SAMP> - - Estilo Salida Simple
</SAMP>
<VAR> - - Estilo Variable
</VAR>
Duglas Oswaldo Moreno Mendoza Página 2
Etiquetas Básicas Referencia HTML
Formato de Listas
Etiquetas Atributos Valores Descripción
<UL> type
Lista no numerada
<LI></LI> disk | circle | square
(aplicados a UL) (viñetas, no ordenada)
</UL>
<OL>
type 1 | I | i | A | a
(aplicados a OL) Lista numerada
<LI></LI>
start
(ordenada)
</OL> Carácter Inicial
(aplicados a OL)
<DL>
<DT></DT> - - Lista de Definiciones
<DD></DD>
</DL>
Vínculos
Etiquetas Atributos Valores Descripción
(archivo html)
href
(#ancla)
(URL, http://www...)
(malito:email)
<A> title (Texto Emergente)
Establece un vínculo o
</A> enlace
_blank
target
_parent
_top
_self
<A> name (nombre del ancla)
Establece un punto de
</A> anclaje
Imágenes
Etiquetas Atributos Valores Descripción
src (archivo imágen)
width
Ancho en píxels o %
(ej. 100px – 40%)
height
Alto en píxels o %
(ej. 100px – 40%)
hspace
Espacio Vertical
(ej. 10px )
vspace
Espacio Horizontal
<IMG> (ej. 10px ) Inserta una imágen
border
Tamaño en pixels
(ej. 10px)
title Título Emergente
alt Texto Alternativo
top
middle
align bottom
left
right
Duglas Oswaldo Moreno Mendoza Página 3
Etiquetas Básicas Referencia HTML
Tablas
Etiquetas Atributos Valores Descripción
width
Ancho en píxels o %
(ej. 100px – 40%)
height
Alto en píxels o %
(ej. 100px – 40%)
border
Tamaño borde exterior
(ej. 10px)
cellspacing
Espaciado entre Celdas
(ej. 5) Inserta una tabla.
<TABLE> cellpadding
Relleno de Celdas Debe encerrar etiquetas
</TABLE> (ej. 5) de filas (<tr>) y celdas
(<td>).
bgcolor Color Hexadecimal
(ejemplo: #000000)
bordercolor (IE)
Color Hexadecimal
(ejemplo: #000000)
background (archivo imágen)
align left | center | right
<CAPTION> align left | center | right Título de la tabla
</CAPTION>
align left | center | right
valign top | middle | bottom Inserta una fila dentro la
<TR> bgcolor
Color Hexadecimal tabla. Debe encerrar
</TR> (ejemplo: #000000) etiquetas de celdas
(<td>)
bordercolor (IE) Color Hexadecimal
(ejemplo: #000000)
background
(archivo imágen)
(no recommendable)
align left | center | right
valign top | middle | bottom
width
Ancho en píxels o %(ej.
100px – 40%)
height
Alto en píxels o %
(ej. 100px – 40%)
bgcolor
Color Hexadecimal
<TD> (ejemplo: #000000) Inserta una celda
</TD> bordercolor (IE)
Color Hexadecimal dentro de la fila
(ejemplo: #000000)
background
(archivo imágen)
(no recommendable)
nowrap -
colspan
Nº columnas abarcadas
(ej. 2)
rowspan
Nº columnas abarcadas
(ej. 2)
<TH> Los mismos que <TD> Los mismos que <TD>
Inserta celda cabecera
</TH> (negrita y centrado)
Duglas Oswaldo Moreno Mendoza Página 4
Etiquetas Básica Referencia HTML
Formularios
Etiquetas Atributos Valores Descripción
action mailto:email
Define un formulario
method post
<FORM> (Solo se indican
etiquetas y atributos
</FORM>
enctype text/plain necesarios para
mandar emails)
name Nombre del Formulario
type text | password
name Nombre del Campo
Define un campo Text o
Nº
<INPUT> maxlenght Password dentro del
(Máximo de caracteres)
Form
size
Nº
(Ancho en caracteres)
value
Valor Inicial
(contenido del campo)
type radio | checkbox
name Nombre del Campo
(si es radio el mismo para Define un casilla de
todos)
<INPUT> opción o una casilla de
value Valor verificacion del Form
checked -
type submit | reset | image
name Nombre del Boton Define un botón de
<INPUT>
enviar, o limpiar el
Valor
value formulario.
(texto del botón)
Ruta de la imagen
src (solo para el tipo
image)
type hidden
<INPUT> name Nombre del Campo Define un campo oculto
value
Valor
(contenido del campo)
name Nombre del Campo
Define un área de texto.
<TEXTAREA> rows Nº de Filas
Se utiliza cuando hay
</TEXTAREA> que insertar gran
cantidad de texto.
cols Nº de columnas
(ancho en caracteres)
Duglas Oswaldo Moreno Mendoza Página 5
Etiquetas Básica Referencia HTML
Name Nombre del Campo
(aplicado a <select>)
Size Altura
<SELECT> (aplicado a <select>) (para lista no deplegable) Define una lista
<OPTION>
multiple desplegable o una lista
Texto Opción -
(aplicado a <select>) de selección (para esta
</OPCION>
aplicar size)
</SELECT> value Valor
(aplicado a <option>) (contenido del campo)
selected -
(aplicado a <option>)
Frames (Marcos)
Etiquetas Atributos Valores Descripción
rows
Valor numérico o %
(ejemplo rows=10%,*,10%)
cols
Valor numérico o %
(ejemplo cols=*,10)
<FRAMESET>
Especifica el número de
frameborder yes | no frames. Debe ir dentro
</FRAMESET>
del <HEAD>
border Valor numérico
bordercolor
Color Hexadecimal
(ejemplo: #000000)
src (página html)
<FRAME>
name nombre del frame Define un frame. Debe
ir dentro del
</FRAME>
noresize - <FRAMESET>
scroll yes | no | auto
<NOFRAME> Alternativa para
navegadores que no
<body></body> - -
soportan frames. Debe
</NOFRAME>
ir dentro del <HEAD>
Duglas Oswaldo Moreno Mendoza Página 6