Guía Rápida de Comandos HTML

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
< < caracteres especiales
> > sean leídos por todos
los navegadores en
& &
sus distintas
" " versiones.
á á
é é La escritura de cada
&iacute í 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.
¿ ¿
¡ ¡

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>

Guía Rápida de Comandos HTML

Cargado por

Información del documento

Título original

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

Guía Rápida de Comandos HTML

Cargado por

Copyright:

Formatos disponibles

GUÍA RÁPIDA DE COMANDOS

También podría gustarte