Вы находитесь на странице: 1из 11

GUÍA RÁPIDA DE COMANDOS

HTML
 El HTML (HIPERTEXT MAKE UP LENGUAGE), son comandos con los que se
desarrollan las páginas WEB. 
A continuación hay una lista con algunos de los comandos usados en
HTML.  
DESCRIPCIO COMENTARIOS
INICIO FINAL
N
Obligatorias
Toda la codificación
Principio de
<html> </html> debe estar incluida en
Documento
estas etiquetas
Dentro del
Encabezado <head> </head> encabezado se
encontrará el título.
Es el texto que
Título <title> </title> aparece en la barra de
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
<body bgcolor="#RRVVAA">
números
 
Color de hexadecimales que
   
Fondo indiquen:
 
RR = tonalidad de
 
color rojo
VV = tonalidad del
color verde
AA = tonalidad del
color azul
nombreimagen.gifde
berá reemplazarse por
<body
Imagen de el nombre de la
background="nombreimagen.gif  
Fondo imagen. Se
">
recomienda utilizar
formatos .gif o .jpg
Colores de <body text="#RRVVAA"   Permite definir los
texto color de Link ="#RRVVAA" colores que se
aplicarán en forma
genérica para el texto
enlaces Vlink ="#RRVVAA"
como para los
enlaces Alink ="#RRVVAA"
enlaces. El color está
visitados  
representado por un
número hexadecimal
Permite definir un
estilo de fuente, color,
Estilos  <style> </style>
tamaño, etc para todo
el documento.
Permite definir
propiedades internas
del documento.
Name =
"description"
content = ”Será el
<meta
resumen con que se
name="description"
publicará en el
content="comentarios"
Meta </meta> buscador. No utilizar
name="keywords"
más de 25 palabras"
content="palabra1 palabra2 ...
Name = "keywords"
palabran">
content = "podrán
definirse palabras
claves para que
nuestro documento
sea encontrado por
los buscadores"
Sonido <bgsound   Ejecuta un archivo de
src="xx.wav" sonido.
loop=infinite/n>  xx.wav se debe
<embed reemplazar por el
src="xx.wav" nombre del
width=200 height=55 archivo; loop nindica
autostart="true" la cantidad de veces
loop="true" que se repetirá.
hidden="true">  La etiqueta Embed
con sus propiedades,
se utiliza por las
incompatibilidades de
los navegadores.
Con esta opción
aparece una consola
cuyas dimensiones se
definen
con Widtho Height y
que puede ocultarse
con Hidden  =
"true"
Presentación de texto
Opciones de formato
Encabezamien </h1></h2>....</h
<h1><h2>....<h6> de texto para
tos 6> 
encabezados,
Negrita <b> </b> Coloca el texto
Cursiva <i> </i> incluido con éstos
Subrayado <u> </u> formatos.
El texto estará
Parpadeo <blink> </blink>
parpadeante
Grande <big> </big> Agranda el texto
Pequeña <small> </small> Disminuye el texto
Representa el texto
Subíndice <sub> </sub>
sobre el renglón o
 Superíndice <sup> </sup>
bajo el renglón.
Permite colocar un
color a la fuente. El
Color del
<font color="#RRVVAA"> </font> color está
Texto 
representado por un
número hexadecimal.
Define un tamaño de
fuente
específico. nrepre-
Tamaño del
<font size="n"> </font> senta un número del 0
Texto 
al 7 al que luego
podrán agregarle los
signos + o -
Permite definir un
Tipo de fuente <font face="nombre de fuente"> </font> nombre de Fuente
específico.
Formato de fuente
Estilo de
<tt> </tt> Courier de tamaño
fuente
menor (Typewriter)
Formato de fuente
Texto
tipo Courier. Se
preformatead <pre> </pre>
representan los
o
espacios en blanco
Texto en <marquee>(texto) </marquee> Permite que un texto
Movimiento tenga movimiento.
Pueden agregarse
atributos para
dimensionar la
marquesina, para
alinear el texto, para
modificar tamaño,
fuente y color.
Traza un línea
Línea  No utiliza horizontal cuyo
<hr="n">
Horizontal etiqueta de cierre grosor está
representado por “n”
Espacio en  No utiliza Representa un
&nbsp
Blanco etiqueta de cierre espacio en blanco.
Comentarios que no
Comentario <!- comentario>  -> serán visibles en la
pantalla.
Escribo Para ver Permiten que los
&lt; <  caracteres especiales
&gt; >  sean leídos por todos
los navegadores en
&amp; &
sus distintas
&quot; " versiones.
&aacute; á  
&eacute; é La escritura de cada
&iacute í carácter comienza
&oacute; ó con el signo
&uacute; ú ampersand (&) y debe
Caracteres &Aacute; Á terminar con punto y
  coma (;)
especiales &Eacute; É
 
&Iacute; Í
En esta tabla vemos
&Oacute; Ó como escribir algunos
&Uacute; Ú símbolos, signos, las
&ntilde; ñ letras Ñ y ñ, y las
&Ntilde; Ñ vocales acentuadas en
&uuml; ü mayúscula y
&Uuml; Ü minúscula.
&#191; ¿
&#161; ¡
 
Presentación de párrafos
Todo texto que se
<center> </center>
escriba entre estas
Alineaciones <left> </left>
etiquetas sufrirá esa
<right> </right>
alineación .
Se utiliza para
Sangría <blockquote> </blockquote>
destacar una cita.
Realiza la separación
Parrafo <p align= entre párrafos, y la
</p>
center*left*right*justify> alineación de estos.
Renglones en Permite dejar
<br>  
blanco renglones en blanco
Tratamiento de imágenes
Permite insertar una
imagen en la página
que estamos
diseñando. El archivo
Imagen de la imagen deberá
<img src="nombreimagen.gif">  
Individual estar 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 pasar
Texto de la <img src="nombreimagen.gif" el puntero del ratón
 
imagen alt="texto"> sobre la imagen o
cuando ésta no se
carga.
Indicará la posición
en que ubicaremos al
texto que acompaña a
Alineación del <img src="nombreimagen.gif"
  la imagen
texto align= top * middle * bottom>
Top Arriba
*Middle Medio
*Bottom Abajo
Define el tamaño de
la imagen
<img src="nombreimagen.gif"
Ancho Width = ancho
width="n"  
Alto * height = altura n =
height="n">
será un valor en
pixeles
<img dynsrc="archivi.avi"  Permite agregar
Videos loop=infinite controls   archivos de video.
start= mouseover>
Listas
Se utiliza cuando las
opciones deben ser
<ol type= A * a * I * i start=n> 
numerados. La opción
<lh> título de la lista </lh> 
Lista typerepresentan
<li> Primera opción   </ol>
numerada número o letras
<li> Segunda opción  
ystart indicará el
<li> Tercera opción 
número con que
inicia.
Lista no <ul type=square * circle * disk>   </ul> Se utiliza cuando las
opciones no presentan
<lh> título de la lista </lh> 
un orden
<li> Primera opción  
ordenada determinado. La
<li> Segunda opción  
opción typerepresenta
<li> Tercera opción 
la viñeta.
<dl>   Se utiliza cuando las
<lh> título de la lista </lh>  opciones llevan un
<dt> Primer tema   título y una definición
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
Enlace a otro
<a href="xxx"> yyy </a> destino del enlace.
URL
yyy es el texto
indicativo que se
leerá en la página. 
Te permite un enlace
<a href = "mailto:dirección e-
Enlace a un directo a tu cliente de
mail"> texto indicativo del </a>
e-mail correo
enlace 
predeterminado
Marca para Referencia una
enlace dentro posición a la que
de la misma <a href="#marca"> Texto de luego se accederá.
</a>
página  enlace al ancla
(Ancla -
Anchor)
Enlaza una posición
Localizar
<a name="marca"> texto del previamente marcada,
enlace </a>
ancla dentro de la misma
anterior
página 
Enlace a otra Enlaza a la posición
página con establecida en marca,
<a href="ab.htm#marca"> texto
marca, dentro </a> en la página ab.htm
indicativo del enlace
del mismo
sitio
Enlace con <a href="xxx"><img </a> xxx se debe
imagenes src="nombreimagen.gif"> reemplazar por la
dirección URL
destino del enlace.
nombreimagen.gifse
debe reemplazar 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
n = representa al
<table border=n
Bordes  grosor del borde.
bordercolor="#RRVVAA">
Color de   También se podrá
 
Bordes especificar el color
 
del borde 
Las celdas podrán
Separación separarse por
<table cellspacing=n>  
entre celdas  el nvalor
 
El contenido podrá
Separación
estar separado del
entre el borde <table cellpadding=n>  
borde por el valor
y el contenido 
indicado en n
Se puede establecer
un valor o un
Alto <table height=n o porcentaje
  porcentaje para
ancho width=n o porcentaje>
definir el tamaño de
la tabla
Color de <table bgcolor="#RRVVAA" Se puede establecer
Fondo o background="imagen.gif"> un color de fondo de
 
Imagen de   toda la tabla o colocar
Fondo   una imagen de fondo
Posibilita colocar un
<caption
título a la tabla
Título align=top * bottom> texto del </caption>
alineadotop=arriba
título
obottom=abajo
Por cada fila que
tenga la tabla deberá
utilizarse esta
<tr  etiqueta: se podrá
Definición de align=left*center*right establecer la
</tr>
filas valign=top*middle*bottom alineación del
bgcolor="#RRVVAA">  contenido, la
ubicación dentro de la
fila y el color de
fondo.
Definición de <th </th>  Permite definir los
títulos align=left*center*right*justify*d nombres de las
ecimal columnas.
valign=top*middle*bottom*basel
ine bgcolor="#RRVVAA"> 
<td Coloca contenidos a
Definición de align=left*center*right*justify*d cada celda
datos o ecimal </td>
contenidos valign=top*middle*bottom*basel
ine bgcolor="#RRVVAA"> 
Celda que Se puede combinar
ocupa muchas <td rowspan=numero de filas>  </td> una celda para que
filas ocupe muchas filas.
 Se puede combinar
Celda que
<td colspan=numero de una celda para que
ocupa muchas </td>
columnas>  ocupe muchas
columnas
columnas.
Formularios
Inicia un formulario.
Se utiliza para la
Definición <form>  
entrada o el envío de
datos.
<form Envía la respuesta
action="mailto:direccion@email" inmediatamente a la
Acciones method=post   dirección especificada
enctype="text/plain">Texto en formato de texto.
referente
Ingresa un objeto
dentro del formulario,
se deberá definir el
tipo de objeto, el
nombre del campo
<input
formulario, el valor
type="text"
inicial que se le
name="nombre del campo
Introducción asigna, el tamaño
formulario"  
de datos máximo de
value="asignación de un dato"
visualización del
size="número"
campo y el tamaño
maxlenght="número">
máximo de caracteres
que puede tener ese
campo.
Con el type = "text"
no se asigna Value
Opciones de  button   checkbox = se
type checkbox visualiza un cuadro
file de verificación, si
hidden deseamos que
image aparezca tildado
agregamos CHECKE
D.
password = el
ingreso se representa
con asteriscos.
radio = visualiza
botones de radio y
permite que el usuario
elija una opción entre
varias. Se agregan
password
tantos input como
radio
opciones deseamos.
reset
reset = visualiza un
submit
botón que al hacerle
text
click borrará los
datos.
submit = visualiza un
botón que al hacerle
click enviará los
datos.
text = crea un campo
para ingresar
caracteres alfa-
numéricos
<textarea  Permite ingresar un
Ingreso de un
name="nombre del campo texto extenso, por
texto que
formulario" </textarea> ejemplo comentarios
ocupa muchas
rows="cantidad de filas"
líneas
cols="cantidad de columnas">
<select name="nombre del Permite optar por los
Ingreso por campo formulario"> datos de un menú
medio de un <option>1º opción </select>
menú <option>2º opción
<option>3º opción
Frames o Marcos
Inicia la definición de
Definición <frameset> </frameset>
un frame.
Frames en <frameset cols="20%,80%">   Define dos frame en
columnas <frameset rows="30%,70%> columnas ocupando
Frame en filas uno el 20% de la
pantalla y el otro el
80% restante.
Define dos frame en
filas ocupando una el
30% de la pantalla y
la otra el 70%
restante
Define en que frame
se cargará cada
página.
<frame src="frame1.htm"> Se asignará
Contenido de
<frame src="frame2.htm"   unname en este
cada frame
name="principal"> casoprincipal para
indicar que se
visualicen 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
Destino del
target="principal"   visualizará 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). 
frameborder =
Atributos del border=0 0indica que no habrá
 
tag frameset frameborder=0 borde de separación
framespacing=0 entre frames. 
framespacing =
0indica que no habrá
huecos de separación
entre frames (para
Explorer).
Atributos del frameborder="no"   Frameborder
tag frame marginheight="número" =elimina los bordes
marginwidth="número" de un frame
name="nombre del frame" marginwidth ymargi
noresize nheight = definen el
ancho y alto de los
margenes del frame.
name = define el
nombre del frame.
Noresize = indica que
scrolling="yes/no/auto" el fram no podrá
src="dirección.htm" redimensionarse.
scrolling = inidca si
tendrá o no barra de
desplazamiento.
src = indica el
contenido del frame.
Si el navegador no
cuenta con la
posibilidad de incluir
Frames, con este tag
Si el frame no puede definirse una
puede <noframes> </noframes> dirección alternativa.
visualizarse Se coloca luego de
los tag FRAME y
llevan dentro un texto
definifo entre los tag
<body> </body>