Guia Rapida de Comandos HTML

GUÍA RÁPIDA DE COMANDOS HTML
DESCRIPCIO COMENTARIOS
INICIO FINAL
N
Obligatorias
Principio de Toda la codificación debe estar incluida

<html> </html> en estas etiquetas
Documento
Dentro del encabezado se encontrará el

Encabezado <head> </head> título.
Es el texto que aparece en la barra de

Título <title> </title> títulos del navegador
Cuerpo <body> </body> Cuerpo de la página
Para toda la página
Permite colocar un color uniforme de

fondo a toda la página. Este color estará
formado por 3 números hexadecimales
que indiquen:
Color de Fondo <body bgcolor="#RRVVAA"> RR = tonalidad de color rojo
VV = tonalidad del color verde
AA = tonalidad del color azul
nombreimagen.gif deberá
Imagen de <body reemplazarse por el nombre de la
Fondo background="nombreimagen.gif"> imagen. Se recomienda utilizar
formatos .gif o .jpg
Colores de <body text="#RRVVAA" Permite definir los colores que se

texto color de Link ="#RRVVAA" aplicarán en forma genérica para el
texto como para los enlaces. El color
enlaces Vlink ="#RRVVAA" está representado por un número
enlaces Alink ="#RRVVAA" hexadecimal
visitados
enlaces activos Ver escala de Colores
Permite definir un estilo de fuente,

Estilos <style> </style> color, tamaño, etc para todo el
documento.
Permite definir propiedades internas del
documento.
<meta Name = "description" content =
name="description" ”Será el resumen con que se publicará
en el buscador. No utilizar más de 25
Meta content="comentarios" </meta> palabras"
name="keywords" content="palabra1 Name = "keywords" content =
palabra2 ... palabran"> "podrán definirse palabras claves para
que nuestro documento sea encontrado
por los buscadores"
<bgsound Ejecuta un archivo de sonido.
src="xx.wav" xx.wav se debe reemplazar por el

nombre del archivo; loop n indica la
cantidad de veces que se repetirá.
loop=infinite/n>
<embed La etiqueta Embed con sus propiedades,
se utiliza por las incompatibilidades de
src="xx.wav" los navegadores.
Sonido
width=200 height=55 Con esta opción aparece una consola
cuyas dimensiones se definen con
Width o Height y que puede ocultarse
autostart="true" con Hidden = "true"
loop="true"
hidden="true">
Presentación de texto
Encabezamient </h1></h2>.... Opciones de formato de texto para

<h1><h2>....<h6> encabezados,
os </h6>
Negrita <b> </b> Coloca el texto incluido con éstos

formatos.
Cursiva <i> </i>
Subrayado <u> </u>
Parpadeo <blink> </blink> El texto estará parpadeante
Grande <big> </big> Agranda el texto
Pequeña <small> </small> Disminuye el texto
Subíndice <sub> </sub> Representa el texto sobre el renglón o

bajo el renglón.
Superíndice <sup> </sup>
Permite colocar un color a la fuente. El
Color del
<font color="#RRVVAA"> </font> color está representado por un número
Texto hexadecimal.
Define un tamaño de fuente específico.

Tamaño del n repre-senta un número del 0 al 7 al
<font size="n"> </font> que luego podrán agregarle los signos +
Texto
o-
Permite definir un nombre de Fuente

Tipo de fuente <font face="nombre de fuente"> </font> específico.
Formato de fuente Courier de tamaño

Estilo de fuente <tt> </tt> menor (Typewriter)
Texto Formato de fuente tipo Courier. Se

<pre> </pre> representan los espacios en blanco
preformateado
Permite que un texto tenga movimiento.

Pueden agregarse atributos para
Texto en
<marquee>(texto) </marquee> dimensionar la marquesina, para alinear
Movimiento el texto, para modificar tamaño, fuente
y color.
Línea No utiliza Traza un línea horizontal cuyo grosor

<hr="n">
Horizontal etiqueta de cierre está representado por “n”
Espacio en No utiliza Representa un espacio en blanco.

&nbsp
Blanco etiqueta de cierre
Comentarios que no serán visibles en la

Comentario <!- comentario> -> pantalla.
Permiten que los caracteres especiales

Escribo Para ver sean leídos por todos los navegadores
en sus distintas versiones.
< <
> > La escritura de cada carácter comienza

con el signo ampersand (&) y debe
Caracteres terminar con punto y coma (;)
& &
especiales
" "
En esta tabla vemos como escribir
algunos símbolos, signos, las letras Ñ y
á á ñ, y las vocales acentuadas en
mayúscula y minúscula.
é é
&iacute í
ó ó
ú ú
Á Á
É É
Í Í
Ó Ó
Ú Ú
ñ ñ
Ñ Ñ
ü ü
Ü Ü
¿ ¿
¡ ¡
Presentación de párrafos
<center> </center> Todo texto que se escriba entre estas

etiquetas sufrirá esa alineación .
Alineaciones <left> </left>
<right> </right>
Sangría <blockquote> </blockquote> Se utiliza para destacar una cita.
Realiza la separación entre párrafos, y

Parrafo la alineación de estos.
<p align= center*left*right*justify> </p>
Renglones en Permite dejar renglones en blanco

<br>
blanco
Tratamiento de imágenes
Permite insertar una imagen en la

página que estamos diseñando. El
Imagen archivo de la imagen deberá estar
<img src="nombreimagen.gif">
Individual ubicado en la misma carpeta que la
página, caso contrario se deberá indicar
su ruta de acceso
Coloca un texto que podrá leerse al

Texto de la <img src="nombreimagen.gif"
pasar el puntero del ratón sobre la
imagen alt="texto"> imagen o cuando ésta no se carga.
Indicará la posición en que ubicaremos

<img src="nombreimagen.gif" al texto que acompaña a la imagen
Alineación del
texto Top Arriba * Middle Medio * Bottom
align= top * middle * bottom>
Abajo
Define el tamaño de la imagen

Ancho <img src="nombreimagen.gif"
width="n"
Width = ancho * height = altura n =
Alto height="n"> será un valor en pixeles
<img dynsrc="archivi.avi" Permite agregar archivos de video.

Videos loop=infinite controls
start= mouseover>
Listas
<ol type= A * a * I * i start=n> Se utiliza cuando las opciones deben ser

<lh> título de la lista </lh> numerados. La opción type representan
Lista número o letras y start indicará el
<li> Primera opción </ol>
numerada número con que inicia.
<li> Segunda opción
<li> Tercera opción
<ul type=square * circle * disk> Se utiliza cuando las opciones no

<lh> título de la lista </lh> presentan un orden determinado. La
Lista no opción type representa la viñeta.
<li> Primera opción </ul>
ordenada
<li> Segunda opción
<li> Tercera opción
<dl> Se utiliza cuando las opciones llevan un

<lh> título de la lista </lh> título y una definición
<dt> Primer tema
Lista con
<dd> Primer detalle </dl>
sangrado
<dd> Segundo detalle
<dt> Segundo tema
<dd> Tercer detalle
<dd> Cuarto detalle
Enlaces o Links
xxx se debe reemplazar por la dirección

URL destino del enlace.
Enlace a otro
<a href="xxx"> yyy </a>
URL yyy es el texto indicativo que se leerá
en la página.
Enlace a un Te permite un enlace directo a tu cliente

<a href = "mailto:dirección e-mail"> de correo predeterminado
</a>
texto indicativo del enlace
e-mail
Marca para Referencia una posición a la que luego

enlace dentro se accederá.
de la misma <a href="#marca"> Texto de enlace al
</a>
página ancla
(Ancla -
Anchor)
Localizar Enlaza una posición previamente

<a name="marca"> texto del ancla </a> marcada, dentro de la misma página
enlace anterior
Enlace a otra Enlaza a la posición establecida en

página con <a href="ab.htm#marca"> texto marca, en la página ab.htm
</a>
marca, dentro indicativo del enlace
del mismo sitio
xxx se debe reemplazar por la dirección

URL destino del enlace.
Enlace con <a href="xxx"><img nombreimagen.gif se debe reemplazar

</a>
imagenes src="nombreimagen.gif"> por el nombre de imagen seleccionado
Enlaza a la dirección URL haciendo un

click sobre la imagen.
Tablas
Definición <table> </table> Crea una tabla
Bordes <table border=n n = representa al grosor del borde.

bordercolor="#RRVVAA"> También se podrá especificar el color
del borde
Color de
Bordes Ver escala de Colores
Separación Las celdas podrán separarse por el n

<table cellspacing=n> valor
entre celdas
Separación El contenido podrá estar separado del
entre el borde y <table cellpadding=n> borde por el valor indicado en n
el contenido
Alto <table height=n o porcentaje Se puede establecer un valor o un

porcentaje para definir el tamaño de la
tabla
ancho width=n o porcentaje>
Color de Fondo Se puede establecer un color de fondo

<table bgcolor="#RRVVAA" de toda la tabla o colocar una imagen de
o
background="imagen.gif"> fondo
Imagen de
Ver escala de Colores
Fondo
<caption Posibilita colocar un título a la tabla

Título </caption> alineado top=arriba o bottom=abajo
align=top * bottom> texto del título
<tr Por cada fila que tenga la tabla deberá

utilizarse esta etiqueta: se podrá
Definición de align=left*center*right
</tr> establecer la alineación del contenido,
filas valign=top*middle*bottom la ubicación dentro de la fila y el color
bgcolor="#RRVVAA"> de fondo.
<th Permite definir los nombres de las

align=left*center*right*justify*decim columnas.
Definición de
al </th>
títulos
valign=top*middle*bottom*baseline
bgcolor="#RRVVAA">
<td Coloca contenidos a cada celda

Definición de align=left*center*right*justify*decim
datos o al </td>
contenidos valign=top*middle*bottom*baseline
bgcolor="#RRVVAA">
Celda que Se puede combinar una celda para que

ocupa muchas <td rowspan=numero de filas> </td> ocupe muchas filas.
filas
Se puede combinar una celda para que

ocupe muchas columnas.
Celda que
ocupa muchas <td colspan=numero de columnas> </td>
columnas
Formularios
Inicia un formulario. Se utiliza para la

Definición <form> entrada o el envío de datos.
<form Envía la respuesta inmediatamente a la

action="mailto:direccion@email" dirección especificada en formato de
Acciones texto.
method=post
enctype="text/plain">Texto referente
Ingresa un objeto dentro del formulario,

<input se deberá definir el tipo de objeto, el
type="text" nombre del campo formulario, el valor
inicial que se le asigna, el tamaño
Introducción name="nombre del campo formulario"
máximo de visualización del campo y el
de datos value="asignación de un dato" tamaño máximo de caracteres que
size="número" puede tener ese campo.
maxlenght="número"> Con el type = "text" no se asigna
Value
checkbox = se visualiza un cuadro de

button verificación, si deseamos que aparezca
checkbox tildado agregamos CHECKED.
password = el ingreso se representa con
file
asteriscos.
hidden radio = visualiza botones de radio y
Opciones de image permite que el usuario elija una opción
type password entre varias. Se agregan tantos input
radio como opciones deseamos.
reset reset = visualiza un botón que al
hacerle click borrará los datos.
submit
submit = visualiza un botón que al
text hacerle click enviará los datos.
text = crea un campo para ingresar
caracteres alfanuméricos
Ingreso de un <textarea Permite ingresar un texto extenso, por
texto que name="nombre del campo formulario" ejemplo comentarios
</textarea>
ocupa muchas rows="cantidad de filas"
líneas cols="cantidad de columnas">
Permite optar por los datos de un menú
<select name="nombre del campo

Ingreso por formulario">
medio de un <option>1º opción </select>
menú <option>2º opción
<option>3º opción
Frames o Marcos
Definición <frameset> </frameset> Inicia la definición de un frame.
Define dos frame en columnas

Frames en <frameset cols="20%,80%"> ocupando uno el 20% de la pantalla y el
otro el 80% restante.
columnas Define dos frame en filas ocupando una
Frame en filas <frameset rows="30%,70%> el 30% de la pantalla y la otra el 70%
restante
Define en que frame se cargará cada

<frame src="frame1.htm"> página.
Contenido de
<frame src="frame2.htm" Se asignará un name en este caso
cada frame principal para indicar que se visualicen
name="principal">
allí los futuros enlaces
Se utiliza como atributo de un enlace e

indica en que frame deberá visualizarse
ese enlace.
"_ blank" = se abrirá una nueva
ventanadel navegador y se visualizará
Destino del
target="principal" en ella.
frame "_self" = el enlace se carga en el propio
frame.
"_top" = el enlace se carga a pantalla
completa en la misma ventana,
suprimiendo los otros frame.
Border = 0 indica que no habrá huecos

de separación entre frames (para
Netscape).
Atributos del border=0 frameborder = 0 indica que no habrá
tag frameset frameborder=0 borde de separación entre frames.
framespacing=0 framespacing = 0 indica que no habrá
huecos de separación entre frames (para
Explorer).
Frameborder = elimina los bordes de

frameborder="no" un frame
marginheight="número" marginwidth y marginheight =
marginwidth="número" definen el ancho y alto de los margenes
Atributos del del frame.
name="nombre del frame"
tag frame name = define el nombre del frame.
noresize Noresize = indica que el fram no podrá
scrolling="yes/no/auto" redimensionarse.
src="dirección.htm" scrolling = inidca si tendrá o no barra
de desplazamiento.
src = indica el contenido del frame.
Si el navegador no cuenta con la
Si el frame no posibilidad de incluir Frames, con este
tag puede definirse una dirección
puede <noframes> </noframes> alternativa. Se coloca luego de los tag
visualizarse FRAME y llevan dentro un texto
definifo entre los tag <body> </body>

Guia Rapida de Comandos HTML

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Guia Rapida de Comandos HTML

Cargado por

Copyright:

Formatos disponibles

GUÍA RÁPIDA DE COMANDOS HTML

Principio de Toda la codificación debe estar incluida

Dentro del encabezado se encontrará el

Es el texto que aparece en la barra de

Cuerpo <body> </body> Cuerpo de la página

Para toda la página

Permite colocar un color uniforme de

Color de Fondo <body bgcolor="#RRVVAA"> RR = tonalidad de color rojo

VV = tonalidad del color verde

AA = tonalidad del color azul

Colores de <body text="#RRVVAA" Permite definir los colores que se

Permite definir un estilo de fuente,

<bgsound Ejecuta un archivo de sonido.

src="xx.wav" xx.wav se debe reemplazar por el

Encabezamient </h1></h2>.... Opciones de formato de texto para

Negrita <b> </b> Coloca el texto incluido con éstos

Subrayado <u> </u>

Parpadeo <blink> </blink> El texto estará parpadeante

Grande <big> </big> Agranda el texto

Pequeña <small> </small> Disminuye el texto

Subíndice <sub> </sub> Representa el texto sobre el renglón o

Define un tamaño de fuente específico.

Permite definir un nombre de Fuente

Formato de fuente Courier de tamaño

Texto Formato de fuente tipo Courier. Se

Permite que un texto tenga movimiento.

Línea No utiliza Traza un línea horizontal cuyo grosor

Espacio en No utiliza Representa un espacio en blanco.

Comentarios que no serán visibles en la

Permiten que los caracteres especiales

&gt; > La escritura de cada carácter comienza

<center> </center> Todo texto que se escriba entre estas

Sangría <blockquote> </blockquote> Se utiliza para destacar una cita.

Realiza la separación entre párrafos, y

Renglones en Permite dejar renglones en blanco

Permite insertar una imagen en la

Coloca un texto que podrá leerse al

Indicará la posición en que ubicaremos

Define el tamaño de la imagen

<img dynsrc="archivi.avi" Permite agregar archivos de video.

<ol type= A * a * I * i start=n> Se utiliza cuando las opciones deben ser

<ul type=square * circle * disk> Se utiliza cuando las opciones no

<dl> Se utiliza cuando las opciones llevan un

xxx se debe reemplazar por la dirección

Enlace a un Te permite un enlace directo a tu cliente

Marca para Referencia una posición a la que luego

Localizar Enlaza una posición previamente

Enlace a otra Enlaza a la posición establecida en

xxx se debe reemplazar por la dirección

Enlace con <a href="xxx"><img nombreimagen.gif se debe reemplazar

Enlaza a la dirección URL haciendo un

Definición <table> </table> Crea una tabla

Bordes <table border=n n = representa al grosor del borde.

Separación Las celdas podrán separarse por el n

Alto <table height=n o porcentaje Se puede establecer un valor o un

Color de Fondo Se puede establecer un color de fondo

<caption Posibilita colocar un título a la tabla

<tr Por cada fila que tenga la tabla deberá

<th Permite definir los nombres de las

<td Coloca contenidos a cada celda

Celda que Se puede combinar una celda para que

Se puede combinar una celda para que

Inicia un formulario. Se utiliza para la

<form Envía la respuesta inmediatamente a la

> > La escritura de cada carácter comienza