Comandos -
file:///D:/Archivos webs/html.htm
GUA RPIDA DE COMANDOS HTML
El HTML (HIPERTEXT MAKE UP LENGUAGE), son comandos con los que se desarrollan las pginas WEB. A continuacin hay una lista con algunos de los comandos usados en HTML. DESCRIPCION Principio de Documento Encabezado Ttulo Cuerpo INICIO Obligatorias <html> <head> <title> <body> Para toda la pgina
Permite colocar un color uniforme de fondo a toda la pgina. Este color estar formado por 3 nmeros hexadecimales que indiquen: RR = tonalidad de color rojo VV = tonalidad del color verde AA = tonalidad del color azul nombreimagen.gif deber reemplazarse por el nombre de la imagen. Se recomienda utilizar formatos .gif o .jpg Permite definir los colores que se aplicarn en forma genrica para el texto como para los enlaces. El color est representado por un nmero hexadecimal
FINAL
COMENTARIOS
Toda la codificacin debe estar incluida en estas etiquetas Dentro del encabezado se encontrar el ttulo. Es el texto que aparece en la barra de ttulos del navegador Cuerpo de la pgina
</html> </head> </title> </body>
Color de Fondo
<body bgcolor="#RRVVAA"> Ver escala de Colores
Imagen de Fondo
<body background="nombreimagen.gif">
<body text="#RRVVAA" Colores de texto Link ="#RRVVAA" color de enlaces Vlink ="#RRVVAA" enlaces visitados Alink ="#RRVVAA" enlaces activos
Ver escala de Colores
Estilos
<style>
</style>
Permite definir un estilo de fuente, color, tamao, etc para todo el documento.
1 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
Meta
<meta name="description" content="comentarios" name="keywords" content="palabra1 palabra2 ... palabran">
</meta>
Permite definir propiedades internas del documento. Name = "description" content = Ser el resumen con que se publicar en el buscador. No utilizar ms de 25 palabras" Name = "keywords" content = "podrn definirse palabras claves para que nuestro documento sea encontrado por los buscadores" Ejecuta un archivo de sonido. xx.wav se debe reemplazar por el nombre del archivo; loop n indica la cantidad de veces que se repetir. La etiqueta Embed con sus propiedades, se utiliza por las incompatibilidades de los navegadores. Con esta opcin aparece una consola cuyas dimensiones se definen con Width o Height y que puede ocultarse con Hidden = "true"
Sonido
<bgsound src="xx.wav" loop=infinite/n> <embed src="xx.wav" width=200 height=55 autostart="true" loop="true" hidden="true">
Presentacin de texto Encabezamientos <h1><h2>....<h6> Negrita Cursiva Subrayado Parpadeo Grande Pequea Subndice Superndice <b> <i> <u> <blink> <big> <small> <sub> <sup> </h1></h2>....</h6> de </b> </i> </u> </blink> </big> </small> </sub> </sup>
Opciones de formato texto para encabezados, texto stos
Coloca el incluido con formatos. El texto parpadeante
estar
Agranda el texto Disminuye el texto Representa el texto sobre el rengln o bajo el rengln. Permite colocar un color a la fuente. El color est representado por un nmero hexadecimal.
Color del Texto <font color="#RRVVAA">
</font>
2 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
Tamao del Texto
<font size="n">
</font>
Define un tamao de fuente especfico. n repre-senta un nmero del 0 al 7 al que luego podrn agregarle los signos + o Permite definir un nombre de Fuente especfico. Formato de fuente Courier de tamao menor (Typewriter) Formato de fuente tipo Courier. Se representan los espacios en blanco Permite que un texto tenga movimiento. Pueden agregarse atributos para dimensionar la marquesina, para alinear el texto, para modificar tamao, fuente y color. Traza un lnea horizontal cuyo grosor est representado por n Representa un espacio en blanco. Comentarios que no sern visibles en la pantalla. Permiten que los caracteres especiales sean ledos por todos los navegadores en sus distintas versiones. La escritura de cada carcter comienza con el signo ampersand (&) y debe terminar con punto y coma (;) En esta tabla vemos como escribir algunos smbolos, signos, las letras y , y las vocales acentuadas en mayscula y minscula.
Tipo de fuente <font face="nombre de fuente"> Estilo de fuente <tt> Texto <pre> preformateado
</font> </tt>
</pre>
Texto en Movimiento
<marquee>(texto)
</marquee>
Lnea Horizontal <hr="n"> Espacio en Blanco Comentario   <!- comentario> Escribo Para ver < < > > & & " " á é í ó ú Á É Í Ó Ú ñ
No utiliza etiqueta de cierre No utiliza etiqueta de cierre
->
Caracteres especiales
3 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
Ñ ü Ü ¿ ¡
Presentacin de prrafos Alineaciones Sangra Parrafo Renglones en blanco <center> <left> <right> <blockquote> <p align= center*left*right*justify> <br> Tratamiento de imgenes
Permite insertar una imagen en la pgina que estamos diseando. El archivo de la imagen deber estar ubicado en la misma carpeta que la pgina, caso contrario se deber indicar su ruta de acceso
</center> </left> </right> </blockquote> </p>
Todo texto que se escriba entre estas etiquetas sufrir esa alineacin . Se utiliza para destacar una cita. Realiza la separacin entre prrafos, y la alineacin de estos. Permite dejar renglones en blanco
Imagen Individual
<img src="nombreimagen.gif">
4 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
Texto de la imagen
<img src="nombreimagen.gif" alt="texto">
Coloca un texto que podr leerse al pasar el puntero del ratn sobre la imagen o cuando sta no se carga. Indicar la posicin en que ubicaremos al texto que acompaa a la imagen Top Arriba * Middle Medio * Bottom Abajo Define el tamao de la imagen Width = ancho * height = altura n = ser un valor en pixeles Permite agregar archivos de video.
Alineacin del <img src="nombreimagen.gif" texto align= top * middle * bottom>
Ancho Alto
<img src="nombreimagen.gif" width="n" height="n"> <img dynsrc="archivi.avi" loop=infinite controls start= mouseover> Listas
Videos
<ol type= A * a * I * i start=n> <lh> ttulo de la lista </lh> Lista numerada <li> Primera opcin <li> Segunda opcin <li> Tercera opcin <ul type=square * circle * disk> <lh> ttulo de la lista </lh> <li> Primera opcin <li> Segunda opcin <li> Tercera opcin <dl> <lh> ttulo de la lista </lh> <dt> Primer tema <dd> Primer detalle <dd> Segundo detalle <dt> Segundo tema <dd> Tercer detalle <dd> Cuarto detalle Enlaces o Links
</ol>
Se utiliza cuando las opciones deben ser numerados. La opcin type representan nmero o letras y start indicar el nmero con que inicia. Se utiliza cuando las opciones no presentan un orden determinado. La opcin type representa la vieta. Se utiliza cuando las opciones llevan un ttulo y una definicin
Lista no ordenada
</ul>
Lista con sangrado
</dl>
Enlace a otro URL
<a href="xxx"> yyy
</a>
xxx se debe reemplazar por la direccin URL destino del enlace. yyy es el texto indicativo que se leer en la pgina. Te permite un enlace directo a tu cliente de correo predeterminado
Enlace a un e-mail
<a href = "mailto:direccin e-mail"> texto indicativo del enlace
</a>
5 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
Marca para enlace dentro de <a href="#marca"> Texto de enlace al ancla la misma pgina (Ancla - Anchor) Localizar enlace <a name="marca"> texto del ancla anterior Enlace a otra <a href="ab.htm#marca"> texto indicativo del pgina con marca, dentro enlace del mismo sitio
</a>
Referencia una posicin a la que luego se acceder.
</a>
Enlaza una posicin previamente marcada, dentro de la misma pgina Enlaza a la posicin establecida en marca, en la pgina ab.htm
</a>
Enlace con imagenes
<a href="xxx"><img src="nombreimagen.gif">
</a>
xxx se debe reemplazar por la direccin URL destino del enlace. nombreimagen.gif se debe reemplazar por el nombre de imagen seleccionado Enlaza a la direccin URL haciendo un click sobre la imagen. Crea una tabla n = representa al grosor del borde. Tambin se podr especificar el color del borde Las celdas podrn separarse por el n valor El contenido podr estar separado del borde por el valor indicado en n Se puede establecer un valor o un porcentaje para definir el tamao de la tabla Se puede establecer un color de fondo de toda la tabla o colocar una imagen de fondo Posibilita colocar un ttulo a la tabla alineado top=arriba o bottom=abajo Por cada fila que tenga la tabla deber utilizarse esta etiqueta: se podr establecer la
Tablas Definicin <table> </table>
<table border=n bordercolor="#RRVVAA"> Bordes Ver escala de Colores Color de Bordes
Separacin entre <table cellspacing=n> celdas Separacin entre el borde y el <table cellpadding=n> contenido Alto ancho <table height=n o porcentaje width=n o porcentaje>
Color de Fondo <table bgcolor="#RRVVAA" o background="imagen.gif"> Imagen de Ver escala de Colores Fondo Ttulo <caption align=top * bottom> texto del ttulo </caption>
Definicin de filas
<tr align=left*center*right valign=top*middle*bottom </tr> bgcolor="#RRVVAA">
6 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
alineacin del contenido, la ubicacin dentro de la fila y el color de fondo.
Definicin de ttulos Definicin de datos o contenidos
<th align=left*center*right*justify*decimal valign=top*middle*bottom*baseline bgcolor="#RRVVAA"> <td align=left*center*right*justify*decimal valign=top*middle*bottom*baseline bgcolor="#RRVVAA">
</th>
Permite definir los nombres de las columnas. Coloca contenidos a cada celda
</td>
Celda que ocupa <td rowspan=numero de filas> muchas filas Celda que ocupa <td colspan=numero de columnas> muchas columnas Formularios Definicin <form>
</td>
Se puede combinar una celda para que ocupe muchas filas. Se puede combinar una celda para que ocupe muchas columnas. Inicia un formulario. Se utiliza para la entrada o el envo de datos. Enva la respuesta inmediatamente a la direccin especificada en formato de texto. Ingresa un objeto dentro del formulario, se deber definir el tipo de objeto, el nombre del campo formulario, el valor inicial que se le asigna, el tamao mximo de visualizacin del campo y el tamao mximo de caracteres que puede tener ese campo. Con el type = "text" no se asigna Value checkbox = se visualiza un cuadro de verificacin, si deseamos que aparezca tildado agregamos CHECKED. password = el ingreso se representa con asteriscos. radio = visualiza botones de radio y permite que el usuario elija una opcin entre varias. Se agregan tantos input como
</td>
Acciones
<form action="mailto:direccion@email" method=post enctype="text/plain">Texto referente
<input type="text" Introduccin de name="nombre del campo formulario" datos value="asignacin de un dato" size="nmero" maxlenght="nmero">
Opciones de type
button checkbox file hidden image password radio reset submit text
7 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
opciones deseamos. reset = visualiza un botn que al hacerle click borrar los datos. submit = visualiza un botn que al hacerle click enviar los datos. text = crea un campo para ingresar caracteres alfanumricos
<textarea Ingreso de un name="nombre del campo formulario" texto que ocupa rows="cantidad de filas" muchas lneas cols="cantidad de columnas"> Ingreso por medio de un men <select name="nombre del campo formulario"> <option>1 opcin <option>2 opcin <option>3 opcin Frames o Marcos Definicin <frameset>
</textarea>
Permite ingresar un texto extenso, por ejemplo comentarios
Permite optar por los datos de un men
</select>
</frameset>
Inicia la definicin de un frame. Define dos frame en columnas ocupando 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 pgina. Se asignar un name en este caso principal 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
Frames en <frameset cols="20%,80%"> columnas Frame en filas <frameset rows="30%,70%>
Contenido de cada frame
<frame src="frame1.htm"> <frame src="frame2.htm" name="principal">
Destino del frame
target="principal"
8 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
visualizar en ella. "_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.
Atributos del tag border=0 frameset frameborder=0 framespacing=0
Border = 0 indica que no habr huecos de separacin entre frames (para Netscape). frameborder = 0 indica que no habr borde de separacin entre frames. framespacing = 0 indica que no habr huecos de separacin entre frames (para Explorer). Frameborder = elimina los bordes de un frame marginwidth y marginheight = definen el ancho y alto de los margenes del frame. name = define el nombre del frame. Noresize = indica que el fram no podr 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 puede definirse una direccin alternativa. Se coloca luego de los tag FRAME y llevan dentro un texto definifo entre los tag <body> </body>
frameborder="no" marginheight="nmero" marginwidth="nmero" Atributos del tag name="nombre del frame" frame noresize scrolling="yes/no/auto" src="direccin.htm"
Si el frame no puede visualizarse
<noframes>
</noframes>
9 de 10
04/10/2011 02:06 p.m.
Comandos -
file:///D:/Archivos webs/html.htm
ltima modificacin: 06/17/2009 16:38:26ltima modificacin: 06/18/2004 09:53:48 2004 Fundacin Aprender
consultas
10 de 10
04/10/2011 02:06 p.m.
