SlideShare una empresa de Scribd logo
1 de 35
QUE ES HTML?
El HTML (Hyper Text MarkupLanguage) es el lenguaje con el que se escriben
las páginas web. Es un lenguaje de hipertexto, es decir, un lenguaje que permite
escribir texto de forma estructurada, y que está compuesto por etiquetas, que
marcan el inicio y el fin de cada elemento del documento.

Un documento hipertexto no sólo se compone de texto, puede contener
imágenes, sonido, vídeos, etc., por lo que el resultado puede considerarse como
un documento multimedia.

Los documentos HTML deben tener la extensión html o htm, para que puedan
ser visualizados en los navegadores (programas que permiten visualizar las
páginas web).
Los navegadores se encargan de interpretar el código HTML de los documentos,
y de mostrar a los usuarios las páginas web resultantes del código interpretado.


Estructura de una página

A lo largo de este tema vamos a aprender a crear una página básica.

La estructura básica de una página es:


<head>

...

</head>


<body>

...

</body>
</html>

<html>
Comandos Básicos


   < HTML > ... < /HTML > : Indica el comienzo y fin de un archivo HTML
   < HEAD > ...< /HEAD > : Indica el comienzo y fin de un encabezado
   (aquí se coloca generalmente el título).
   < TITLE > ...< /TITLE > : Indica el título.
   < BODY > ...< /BODY > : Indica el comienzo y fin del cuerpo de la
   página.
   < P > ...< /P > : Indica comienzo y fin de un párrafo.
   < BR > : Permite saltarse una línea (se llama quiebre de línea).
   <Hn > ...<Hn > : Para n entre 1 y 6, hacen que el texto encerrado aparezca
   como encabezado (un subtítulo). Se recomienda usar sólo 1,2 y 3.
   Tipos de letras:
       o < B > ...< /B > : Negrita.
       o < L > ...< /L > : Cursiva.
       o < BLINK > ...< /BLINK > : Parpadeante.
       o < STRONG > ...< /STRONG > : Enfatizada.
   < UL > ...< /UL > : Indica comienzo y fin de una lista no ordenada
   (puntos). Dentro de ellos, cada item empieza por < LI > y termina al
   terminar la línea.
   < OL > ...< /OL > : Indica comienzo y fin de una lista ordenada (números).
   Dentro de ellos, cada item empieza por < LI > y termina al terminar la
   línea.
   Ejemplo:
   <   OL >
   <   LI > Primer item
   <   LI > Segundo item
   <   UL >
   <   LI > Primer subitem
   <   LI > Segundo subitem
   <   /UL >
   <   LI > Tercer item
   <   /OL >



   Y esto se ve

        1. Primer item
        2. Segundo item
               Primer subitem
  Segundo subitem
           3. Tercer item

Gráficos
En HTML se pueden incluir gráficos en dos formatos: gif y jpg. Estos formatos
son conocidos por los browsers, por lo tanto no es necesario un programa
especial para verlos, y se ven directamente en la página junto con el texto. Si se
quisieran utilizar otros formatos, se deben ocupar comandos externos
al browser para hacerlo.

La sintaxis para la inclusión de gráficos es la siguiente:

<imgsrc=archivo.{gif,jpg} Nombre del archivo
                 width= Ancho del archivo(en puntos
                 height= Altura del archivos (en puntos)
                  align= Alineación de la imagen y textos (ver más abajo)
                border= Ancho del borde de la imagen
                        >




Por ejemplo:

                           <imgsrc="images/hola.gif" >

Produce:




La opcion align tiene relación con la posición de la imagen con respecto al texto
que viene a continuación. He aquí un ejemplo:
Align=top (por defecto)




                      Texto a continuación
       Align=middle




                   Texto a continuación
       Align=bottom




                      Texto a continuación




Referencias
Existen tres tipos principales de referencias a otros textos:


       Referencias a otras páginas:
       <a href="otra_pagina.html" >Ir a otra pagina</a>
       Se ve como:
       Ir a otra pagina
       Basta presionar sobre el texto subrayado (y generalmente en otro color)
       para ir a la otra página

       Referencias a temas:
       <a href="#tema" >Ir a otro tema </a>
       Si se presiona sobre el texto subrayado se va a otra parte de la misma
       página, que se marcó con la instrucción <a name="tema">.
ATRIBUTOS



ALINK="..." Especifica el color de las Direcciones activadas en la página.

BACKGROUND="..." Especifica el papel tapiz de la página. un Archivo *.jpg o *.gif.

BGCOLOR="..."Especifica el Color del Fondo del Documento.

Los colores son expresados en formato RGB(Red, Green,Blue), donde cada color tiene un valor
desde el 0 (0) hasta el 255 (FF).



Amarillo = #FFFF00

Azul = #0000FF

Azul Claro = #00CCFF

Blanco = #FFFFFF

Gris = #CC9999

Lila = #CC33FF

Negro = #000000

Rojo = #FF0000

Verde = #00FF00



BGPROPERTIES=FIXED Fija la imagen del Fondo para que no se desplace. (IE)

LEFTMARGIN="..." Especifica el margen Izquierdo de todo el documento.(IE)

LINK="..." Especifica el color de las direcciones contenidas en el documento.

TEXT="..." Especifica el Color del texto.

TOPMARGIN="..." Fija el margen superior de todo el Documento.(IE)

VLINK="..." Especifica las direcciones visitadas, incluidas en el Documento.



<BASEFONT atributo= " ">
Fija los atributos de escritura en toda la página.



ATRIBUTOS

SIZE="..." Fija el tamaño de las Letras, se usa un número entre 1 y 7 donde el 3 es el tamaño por
omisión. Tambien permite tamaños relativos, e.j. SIZE=+2 .

COLOR="..." Especifica el color de las Letras en todo el Documento.

NAME="..." Especifica el tipo de apariencia de la Letra en todo el Documento.



<Hn>...< /Hn>

Especifica un encabezado de texto de varios tamaños, n indica los tamaños de 1 a 6, 1 es el más
grande y 6 es el más pequeño.



<ISINDEX>

Muestra un diálogo de indice de busqueda. Con este comando solamente no se puede crear una
pagina de busqueda, el Servidor debe ser configurado para soportarlo.



Atributos:

ACTION="..." Especifica la ubicación del puerto del programa donde se pasará los parámetros de
busqueda.

PROMPT="..." Especifica un mensaje alterno para el diálogo.



Formato General:

<ADDRESS>.....< /ADDRESS>

Encierra el archivo de firma del autor de la página. El texto se muestra en Italicas.



<B>...< /B>

Resalta en Negritas el Texto encerradot.
<BIG>...< /BIG>

Incrementa el tamaño del Texto.



<BLINK>.....< /BLINK>

Hace el texto parapadeante.



<BLOCKQUOTE>.....< /BLOCKQUOTE>

Encierra un enfasis. El margen izquierdo y derecho están indentados.



<BR>

Inserta un final de línea.



Atributos:

CLEAR="..."--Causa que el texto alrededor de la imagen se elimine. Los valores posibles son: RIGHT,
LEFT, o ALL.



<CENTER>.....< /CENTER>

Centra los objetos que contiene. Este comando puede centrar cualquier cosa incluyendo
imagenes, texto, tablas, formularios, etc.



<CITE>.....< /CITE>

Encierra una Cita como un titulode un libro,etc.



<CODE>.....< /CODE>

Encierra Codigo de ejemplo. El texto se muestra en letras pequeñas.
<COMMENT>.....< /COMMENT>

Define un comentario. Todo el texto es ignorado aun si incluye codigo HTML.



<DFN>.....< /DFN>

Encierra una definición. El texto dentro de este comando se formatea como una definición.



<DIV ALIGN=">...< /DIV>

Especifica el alineamiento de los elementos que contiene. Se puede usar para dividir el documento
que tiene secciones alineadas en forma diferente.



Atributos:

ALIGN="..."--Fija el alineaminto. Por ejemplo: "center", "right", o "left".



<EM>...< /EM>

El texto se muestra en cursivas (Itálicas).



<FONT atributo=">...< /FONT>

Fija las propiedades y el tipo de letra del texto que contiene.



Atributos:

SIZE="..."--Fija el tamaño de las letras desde valores entre 1 y 7 donde 3 es el valor por omisión. Se
puede especificar valores relativos, ejemplo. SIZE=+3 .

COLOR="..."--Especifica el color de las letras.

FACE="..."--Especifica el tipo de letra. Se puede definir una lista separada por comas. Por ejemplo:
Arial, Verdana, etc.
<HR atributo1="..." atributo2="...">

Inserta una líea horizontal.



Atributos:

SIZE="..."--Especifica el grosor de la línea.

COLOR="..."--Especifica el color de la línea.(IE)

WIDTH="..."--Especifica la longitud de la línea como porcentaje de la página, ejemplo. WIDTH=70%
.

ALIGN="..."--Especifica el alineamiento: RIGHT, LEFT, o CENTER.

NOSHADE--Muestra la línea como sólido.



<I>...< /I>

Presenta el texto encerrado como Itálicas.



<KBD>...< /KBD>

Especifica el texto a ser entrado por teclado. El texto se muestra en negritas y de tamaño fijo.



<LISTING>.....< /LISTING>

Muestra texto en tamaño fijo. Obsoleto -- se usa el comando PRE.



<MULTICOL>.....< /MULTICOL>

Muestra un texto en columnas.



Atributos:

COLS="..."--Especifica el numero de columnas.

GUTTER="..."--Especifica el numero de pixels entre columnas.
WIDTH="..."-- Especifica el ancho de las columnas.



<NOBR>.....< /NOBR>

El texto que lo contiene no se trunca en la pantalla.



<P atributo>...< /P>

Diseñado para encerrar texto de un parrafo. El cierre es opcional.



Atributos:

ALIGN="..."--Especifica el alineamiento del parrafo. Por ejemplo:"center", "left", o "right".



<PLAINTEXT>.....< /PLAINTEXT>

Muestra el texto sin formato aun cuando contenga comandos de HTML. Obsoleto -- Se usa el
comando PRE.



<PRE>.....< /PRE>

Muestra texto sin formato, sin eliminar espacios y saltos.



<S>.....< /S>

Muestra el texto con una línea por el centro (tachado). Es diferente al comando <STRIKE>.



<SAMP>...< /SAMP>

Indica un ejemplo de salida para un formulario o programa. El texto se muestra en tamaño
pequeño.



<SMALL>...< /SMALL>
Muestra el texto en tamaño pequeño.



<SPACER atributo>...< /SPACER>

(Netscape) Inserta bloques de espacios en la página.



Atributos:

ALIGN="..."--Cuando el tipo es de Bloque (BLOCK) especifica el alineamiento del texto alrededor.

Valores:




RIGHT o LEFT--Alinea el bloque de espacios en el lado especificado, y el texto se trunca alrededor
del bloque.

TOP, MIDDLE, BOTTOM, TEXTTOP, ABSMIDDLE, BASELINE, y ABSBOTTOM--Especifica el
alineaminto vertical del bloque con cualquier elemento el la misma línea.

HEIGHT="..."--Cuando el tipo es BLOCK, especifica la altura del bloque.

SIZE="..."--Cuando el tipo es HORIZONTAL, o VERTICAL, especifica el tamaño del espacio.

TYPE="..."--Especifica el tipo de espacio.

Valores:




HORIZONTAL--Inserta espacios en blanco entre palabras.

VERTICAL--Inserta espacios entre dos líneas.

BLOCK--Inserta un bloque de espoacios rectangular, muchos usan el comando IMG.

WIDTH="..."--Cuando el tipo es BLOCK, especifica el ancho del bloque.



<STRONG>...< /STRONG>
Muestra el texto en negritas, resaltado.



<SUB>...< /SUB>

Muestra el texto encerrado como un subindice.



<SUP>...< /SUP>

Muestra el texto encerrado como superindice.



<TT>...< /TT>

Muestra el texto en formato teletipo.



<U>...< /U>

Muestra el texto subrayado. No use este comando puede confundir con una dirección o Link.



<VAR>...< /VAR>

Especifica una variable. Eltexto se muestra en letras pequeñas y de tamaño fijo.



<WBR>

Hace que el texto que contiene, se trunque si es necesario.



<XMP>...< /XMP>

Hace que el texto encerrado se muestre sin procesar los coamdos HTML que contenga. Obsoleto --
Se usa el comando PRE.



Master Thian
Master Thian

Administrador




Cantidad de envíos: 2332

Edad: 19

Localización: Santiago-Chile

Estrellas:

Respeto de las normas del foro:



Estado

Nivel: 14

experiencia:

 (63/185)

Clan: DarKneS

Mensaje n°2

Mutimedia

por Master Thian el Mar Abr 22, 2008 5:48 am

Multimedia:



<IMG atributo1 atributo2>

Coloca una imagen el en documento.



Atributos:

SRC="..." Especifica la ubicación de la Imagen.
DYNSRC="..." Especifica la ubicación de un video o un mundo VRML. Se puede soportar una
imagen usando el SRC de primero para aquellos Browser que no soportan Videos. (IE)

CONTROLS Activa una serie de controles de Video. (IE)

LOOP="n" Para videos, especifica en número de repetición del video. Un valor de "-1" o "INFINITE"
repite el video indefinidamente. (IE)

START="..." Especifica el momento inicial de reproducción del video. Se puede usar "FILEOPEN"
por omisión, "MOUSEOVER", o ambos. (IE)

USEMAP="#map1" Dice al Browser que use la imagen como una interface de selección definida
con el nombre de "map1".

ISMAP Dice al Browser que la imagen es un mapa de Selección.

ALT="..." Especifica un texto que se muestra en los Browser que no soportan imagenes.

BORDER="..." Especifica el ancho del borde alrededor de la imagen. Si BORDER es "0", No presenta
bordes en la imagen.

LOWSRC="..."--Especifica la Direeción de la imagen que se cargará primero antes de que la imagen
sea cargada. LOWSRC usualmente se refiere a una imagen pequeña.

ALIGN="..."--especifica el alineamiento de la imagen.

Valores:




RIGHT o LEFT--Alinea a un lado especifico de la página, y todo el texto se justifica al lado de la
imagen.

TOP, MIDDLE, BOTTOM, TEXTTOP, ABSMIDDLE, BASELINE, y ABSBOTTOM--Especifica el
alineamiento vertical de la imagen.



VSPACE="..."--Especifica el espacio entre el borde de la imagen y los items encima o debajo de ella.

HSPACE="..."--Especifica el espacio entre el borde de la imagen y los items a la derecha e
izquierda.

WIDTH="..."--Especifica el ancho de la imagen. Si el tamaño no coincide con el original se ajusta.

HEIGHT="..."--Igual al anterior pero con la altura.
<MAP atributo>...< /MAP>

Especifica los puntos de selección de una imagen. El comando AREA se usa para definir las
coordenadas.



Atributos:

NAME="..."--Especifica el nombre del mapa para ser usado después.




<AREA atributo1 atributo2>...< /AREA>

Especifica la silueta y el tamaño del area de selección elel mapa que se muestra. Se usa dentro del
comando MAP.



Atributos:

SHAPE="..."--Especifica la Silueta del area de selección. Los valores posibles son RECT, RECTANGLE,
CIRC, CIRCLE, POLY, o POLYGON.

COORDS="..."--Especifica la coordenada de la silueta. Dos pares de coordenadas indican un
rectangulo, tres o mas pares definen un poligono, y un par de coordenadas y un radio define un
Circulo.

HREF="..."--Especifica la dirección donde apunta el area del mapa.

NOHREF--Indica que esta silueta no apunta a una dirección.

TARGET="..."--Especifica la ventana donde se mostrará la página. El target puede ser el nombre de
un Frame o alguno de los siguientes valores:



"_blank"--Muestra la dirección en un página en blanco.

"_parent"--Muestra la dirección en la pagina que lo invocó.

"_self"--Muestra la dirección en la misma ventana. (poromisioón)

"_top"--Muestra la dirección en la ventana actual usnado todo el espacio.
<MAP atributo>...< /MAP>

Especifica los puntos de selección de una imagen. El comando AREA se usa para definir las
coordenadas.



Atributos:

NAME="..."--Especifica el nombre del mapa para ser usado después.




<AREA atributo1 atributo2>...< /AREA>

Especifica la silueta y el tamaño del area de selección elel mapa que se muestra. Se usa dentro del
comando MAP.



Atributos:

SHAPE="..."--Especifica la Silueta del area de selección. Los valores posibles son RECT, RECTANGLE,
CIRC, CIRCLE, POLY, o POLYGON.

COORDS="..."--Especifica la coordenada de la silueta. Dos pares de coordenadas indican un
rectangulo, tres o mas pares definen un poligono, y un par de coordenadas y un radio define un
Circulo.

HREF="..."--Especifica la dirección donde apunta el area del mapa.

NOHREF--Indica que esta silueta no apunta a una dirección.

TARGET="..."--Especifica la ventana donde se mostrará la página. El target puede ser el nombre de
un Frame o alguno de los siguientes valores:



"_blank"--Muestra la dirección en un página en blanco.

"_parent"--Muestra la dirección en la pagina que lo invocó.

"_self"--Muestra la dirección en la misma ventana. (poromisioón)

"_top"--Muestra la dirección en la ventana actual usnado todo el espacio.
<BGSOUND atributo1 atributo2> (IE)

Reproduce un archivo de sonidos en el fondo cuando la página es cargada. Este archivo de sonido
puede ser de tipo (.wavor .au) o midi (.mid).



Atributos:

SRC="..."-- indica el archivo de musica.

LOOP="n"-- Indica el numero de veces que se repite. Un valor de "-1" o "INFINITE" indica una
reproducción sin interrupción.




<MARQUEE atributo1 atributo2>...< /MARQUEE> (IE)

Fija un texto que se desplaza por la pantalla.



Atributos:

ALIGN="..."-- Especifica el alineaminto del texto. Loa valores posibles son "TOP", "MIDDLE", o
"BOTTOM".

BEHAVIOR="..."--Indica la forma de presentación "SCROLL" (omisión), "SLIDE", o "ALTERNATE".
"SLIDE" hace que el texto se desplaze afuera y adentro , "ALTERNATE" muestra el texto adelante y
atras repetidamente.

BGCOLOR="..."-- Fija el color de fondo.

DIRECTION="..."--Indica la Dirección "LEFT" (omisión) o "RIGHT".

HEIGHT="..."-- Fija la altura del texto en Pixels o %.

HSPACE="n"--Fija el margen en espacios a la derecha e izquierda del texto.

LOOP="n"-- Fija el numero de repeticiones. Un valor de "-1" o "INFINITE" repite indefinidamente.

SCROLLAMOUNT="n"-- Fija el Numero de pixel entre cada display.

SCROLLDELAY="n"--Indica el tiempo de espera para mostrar cada texto.
VSPACE="n"-- Fija el margen superior e inferior del texto.

WIDTH="..."-- Fija el ancho del Marquee en pixels o %.



<APPLET atributo1 atributo2> parametros1 parametros2 ...< /APPLET>

Inserta un applet de Java en el documento. Cualquier texto dentro del comando APPLET se
mostrará en los browser que no soportan JAVA.



Atributos:

ALIGN="..."-- Fija el alineamiento del applet, los parametros son "LEFT", "RIGHT", "TOP",
"MIDDLE", o "BOTTOM".

ALT="..."--Muestra un mensaje cuando el brwoser no puede ejecutar el applet.

CODE="..."--Especifica el nombre del applet.

CODEBASE="..."--Especifica la dirección de inicio del applet. El directorio donde se encuentra el
applet.

DOWNLOAD=n--Especifica el orden de descarga de la imagenes.

HIGHT="..."--Especifica la altura del applet en pixels o %.

HSPACE="n"--Especifica los margenes en espacios fuera del applet en pixels.

NAME="..."-- Indica el nombre de un applet (rutina), si hay masapplets en una misma página.

VSPACE="n"--Especifica el margen superio e inferior del applet.

WIDTH="..."--Fija el ancho del applet en pixel o en %.



Parametros:

Estos son los parametros especificaos de cada applet, que son pasasdos como argumentos. Se
expresan como comandos así



<PARAM NAME="..." VALUE="..." >
<EMBED atributo1 atributo2>< /EMBED>

Inserta un objeto multimedia, como un corto de video o sonido, en la página. En los browser
modernos se mantiene por compatibilidad.



Atributos:

AUTOSTART="..."--Especifica si iniciar la ejecución o No."TRUE" o "FALSE".

HIGHT="..."-- Especifica el tamañ en pixels o %.

LOOP="..."-- Fija el numero de repeticiones. Los valores son "TRUE" o "FALSE".

NAME="..."-- Indica el nombre del Objeto, en caso de haber otros en la página.

SRC="..."-- Indica la ubicación del archivo.

WIDTH="..."--Especifica el ancho donde se mostrará el objeto.



<SCRIPT atributo> ...sentencias script ... < /SCRIPT>

Encierra el codigo de programación que se ejecuta en la pagina. Para matener compatibilidad los
comandos están marcados como cometarios, (<!-- comandos script... -->)



Atributos:

LANGUAGE="..."--Especifica el elnguaje usado en el script, como "VBScript" Visual Basic Script o
"JavaScript" Java Script. b>

SRC="..."-- Indica la ubicación del archivo que contiene un script.

Se usa si ud. no quiere tener el codigo de programación en la página.



<NOSCRIPT> ...< /NOSCRIPT>

Muestra todo lo que quiera diferente a codigo de programación. Este comando va dentro del
comando SCRIPT.



Direcciones (Links):
<A atributo="...">...< /A>

Cuando se usa con el atributo HREF, el texto o la grafica apunta a otro documento o función.
Cuando se usa el atributo NAME, el texto o la grafica identifica el nombre del documento.



Atributos:

HREF="..."--Especifica la URL (ubicación) al documento señalado.

NAME="..."--Especifica el nombre del encadenamiento. onClick="-- Especifica un codigo script
cunado se hace click con el mouse. onMouseOver="--Activa un codigo script cuando el mouse está
sobre el link.

REL="..."-- Especifica una relación Directa.

REV="..."--Especifica una relación Inversa.

TARGET="..."--Especifica la ventana donde se mostrará la página. El contenido puede ser el
nombre de un Frame pre-definido o alguno como sigue:

Valores:




"_blank"--Carga la página en una ventana en blanco.

"_parent"--Craga la página en la ventana del documento que lo llamó.

"_self"--Carga la página en la misma ventana. (Omisión)

"_top"--Carga la página en toda la ventana, sin importar el frame.




TITLE="..."--Especifica una leyenda que aparece cuando se ubica sobre el link, pero que aun no se
ha seleccionado.



Listas (Lists:):
<LI atributo>

Este comando enumera los parrafos como una lista de palabras usando los siguientes sub-
comandos: <DIR>,<MENU>, <OL>, o <UL>.



Atributos:

TYPE="..."

--Especifica el tipo de indicador de la lista. Los valores mas comunes son: DISC, CIRCLE, SQUARE, A,
a, I, i, 1.



VALUE="..."--Especifica el valor asignado a un item.



<DIR>...< /DIR>

Convierte el texto encerrado por <LI>, en una lista de directorio.



<MENU>...< /MENU>

Convierte el texto encerrado por <LI>, en una lista de menus.



<OL atributo>...< /OL>

Convierte al texto encerrado por <LI>, en una lista numerada.



Atributos:

TYPE="..."--Especifica el tipo de numeracion para el indicador. Un tipo de indicador sería: A, a, I, i,
1.

START="..."--Especifica el valor inicial de la numeración.

<UL atributo>...< /UL>

Convierte el texto encerrado por <LI>, en una lista indicada.
Atributos:

TYPE="..."--Especifica el tipo de indicador para la lista. Los valores comunes son: DISC, CIRCLE,
SQUARE.



<DL>...< /DL>

Crea una lista definida. Donde, <DT> especifica un termino de la lista y <DD> especifica el
contenido del termino.



Particiones de Ventanas (Frames):



<FRAMESET atributo1="..." atributo2="...">...< /FRAMESET>

Define una serie de ventanas que forman una página. Los comandos FRAME, y NOFRAMES van
dentro de FRAMESET. El comando FRAMESET se usa como el comando BODY.

Se puede incluir un comando BODY dentro del comando NOFRAMES para aquellos browser que no
soportan frames.



Atributos:

BORDER="..."--Indica el ancho (en pixels) del borde alrededor del frame.(Netscape)

COLS="..."--Crea el frame como columnas y fija el tamaño de cada columna. El ancho se puede
expresar en %, pixels, o en tamaño relativo (*). Por ejemplo, Si usted queire 3 frames de igual
tamaño en forma de columna use el atributo COL así: COLS=33%,33%,*


FRAMEBORDER="..."--Especifica si se muestra el borde del frame en 3D o No. Los valores comunes
son; 0 (sin borde) o 1 (Omisión).(IE)

FRAMESPACING="..."--Especifica la separación en pixels entre frames.

ROWS="..."--Al igual que COLS especifica frames en forma de filas.

Por ejemplo, si desea un pequeño frame arriba de la página y uno grande debajo el atributo ROWS
sería: ROWS=15%,*
SCROLLING="..."--Indica si los frames llevan barra de desplazamiento.

Los valores mas comunes son "yes", "no", y "auto".



<FRAME atributo1="..." atributo2="...">

Define un frame simple.



Atributos:

BORDER="..."--Especifica el ancho en pixels del borde alrededor del frame.(Netscape)

FRAMEBORDER="..."--Especifica si se muestra el borde del frame en 3D o No. Los valores comunes
son; 0 (sin borde) o 1 (Omisión).(IE)

MARGINHEIGHT="..."--Especifica los margenes superior e inferior.

MARGINWIDTH="..."--Especifica el margen izquierdo y derecho.

NAME="..."--Asigna un nombre al frame.

NORESIZE--Impide que el usuario cambie el tamaño.

SCROLLING="..."--Indica si los frames llevan barra de desplazamiento. Los valores mas comunes
son "yes", "no", y "auto".

SRC="..."--Indica el archivo que contiene el frame.



<IFRAME atributo1="..." atributo2="...">< /IFRAME> (IE)

Define un frame eventual. No necesita el comando FRAMESET.



Atributos:

ALIGN="..."--Especifica la posicion del texto alrededor del frame. Los valoresposibles son TOP,
MIDDLE, BOTTOM, LEFT, y RIGHT.

FRAMEBORDER="..."--Especifica si se muestra el borde del frame en 3D o No. Los valores comunes
son; 0 (sin borde) o 1 (Omisión).(IE)

HEIGHT="..."--Especifica la altura del frame eventual.
MARGINHEIGHT="..."--Especifica los margenes superior e inferior.

MARGINWIDTH="..."--Especifica el margen izquierdo y derecho.

NAME="..."--Asigna un nombre al frame.

NORESIZE--Impide que el usuario cambie el tamaño.

SCROLLING="..."--Indica si los frames llevan barra de desplazamiento. Los valores mas comunes
son "yes", "no", y "auto".

SRC="..."--Indica el archivo que contiene el frame.

WIDTH="..."--Especifica el ancho del frame eventual.



<NOFRAMES>...< /NOFRAMES>

Se utiliza dentro de FRAMESET, cualquier objeto dentro de este comando se ve solo en browsers
que no soportan frames.




_________________

Mi mejor firma =)




Master Thian



Master Thian

Administrador
Cantidad de envíos: 2332

Edad: 19

Localización: Santiago-Chile

Estrellas:

Respeto de las normas del foro:



Estado

Nivel: 14

experiencia:

 (63/185)

Clan: DarKneS

Mensaje n°3

Tablas

por Master Thian el Mar Abr 22, 2008 5:49 am

TABLAS



<TABLE atributo1="..." atributo2="...">...< /TABLE>

Crea tablas compuesta por filas y columnas.



Atributos:



BORDER="..."--Especifica el ancho del borde alrededor de la tabla. Si se fija en 0, no presenta
bordes.

BACKGROUND="..."--Usa una imagen para el fondo de la tabla.(IE)
BGCOLOR="..."--Fija el color de fondo de la tabla.

BORDERCOLOR="..."--Fija el color del borde.

BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE)

BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE)

WIDTH="..."--Especifica el ancho de la tabla en la página.

CELLSPACING="..."--Especifica los espacios entre las celdas.

CELLPADDING="..."--Especifica los espacios entre la celda y el texto.

FRAME="..."--Especifica el borde que se debe mostrar.(IE)

Tipos Posibles:



VOID--No muestra los bordes exteriores.

ABOVE--Muestra el borde encima de la tabla.

BELOW--Muestra el borde debajo de la tabla.

HSIDES--Muestra los bordes superio e inferior de la tabla.

LHS--Muestra el borde de la izquierda.

RHS--Muestra el borde de la derecha.

VSIDES--Muestra el borde derecho e izquierdo.

BOX--Muestra todos los bordes de la tabla.

BORDER--Muestra un borde en todos los lados de la tabla.



HEIGHT="..."--Especifica la altura de la tabla en la página.

RULES="..."--Especifica los bordes internos.(IE)

Tipos Posibles:




NONE--No muestra los bordes internos.
GROUPS--Muestra los bordes como si fueran varias tablas y grupos THEAD, TFOOT, TBODY, y
COLGROUP.

ROWS--Muestra los bordes entre filas.

COLS--Muestra los bordes entre columnas.

ALL--Muestra todos los bordes tanto filas como columnas.



<CAPTION atributo1="...">...< /CAPTION>

Especifica una titulo para la tabla.



Atributos:

ALIGN="..."--Fija la posición del titulo. los valores usados son:LEFT, RIGHT, BOTTOM, o TOP.



<TR atributo1="..." atributo2="...">...< /TR>

Especifica los datos en filas de una tabla. Puede encerrar el encabezado y los datos.



Atributos:

ALIGN="..."--Indica el alineamiento de los datos en la fila. Por ejemplo; LEFT, RIGHT, y CENTER.

BGCOLOR="..."--Fija un color de fondo para una fila.

BORDERCOLOR="..."--Fija el color del borde de la fila.

BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE)

BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE)

VALIGN="..."--Fija el alineaminto vertical de los datos en la fila. Los valores son; TOP, MIDDLE,
BOTTOM, y BASELINE.

HEIGHT="..."--Especifica el alto de la celda.



<TH atributo1="..." atributo2="...">...< /TH>
Convierte una celda en encabezado de la tabla.



Atributos:

ALIGN="..."--Indica el alineamiento de los datos en la fila. Por ejemplo; LEFT, RIGHT, y CENTER.

BGCOLOR="..."--Fija un color de fondo para una fila.

BORDERCOLOR="..."--Fija el color del borde de la fila.

BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE)

BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE)

VALIGN="..."--Fija el alineaminto vertical de los datos en la fila. Los valores son; TOP, MIDDLE,
BOTTOM, y BASELINE.

HEIGHT="..."--Especifica el alto de la celda.

NOWRAP--Previene el truncamineto del texto en la celda.

ROWSPAN="..."--Especifica el numero de filas a unir.

COLSPAN="..."--Especifica el numero de Columnas a unir.

WIDTH="..."--Especifica el ancho de la celda.



<TD atributo1="..." atributo2="...">

Se usa dentro del comando TR y define los datos en una celda.

Se puede usar el cierre del comando.



Atributos:

BACKGROUND="..."--Usa una imagen para el fondo de la celda.(IE)

BGCOLOR="..."--Fija el color de fondo de la celda.

BORDERCOLOR="..."--Fija el color del borde.

BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE)

BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE)
WIDTH="..."--Especifica el ancho de la tabla en la página.

HEIGHT="..."--Especifica el alto de la celda.

NOWRAP--Previene el truncamineto del texto en la celda.

ROWSPAN="..."--Especifica el numero de filas a unir.

COLSPAN="..."--Especifica el numero de Columnas a unir.

WIDTH="..."--Especifica el ancho de la celda.

VALIGN="..."--Fija el alineaminto vertical de los datos en la fila. Los valores son; TOP, MIDDLE,
BOTTOM, y BASELINE.

ALIGN="..."--Especifica el alineamiento horizontal de la celda. Los parametros son; LEFT, RIGHT,
and CENTER.



<COLGROUP atributo1="..." atributo2="...">(IE)

Especifica las propiedades de una o mas columnas. Este comando va despues del comando TABLE.



Atributos:

ALIGN="..."--Especifica la posición del texto dentro de la columna. Los parámetros son; CENTER,
LEFT, RIGHT, BOTTOM, o TOP.

SPAN="..."--Indica las colunas donde se aplica.



<COL atributo1="..." atributo2="...">(IE)

Se usa con el comando COLGROUP, y especifica la propiedad de una columna. Este comando
omite cualquier atributo del comando COLGROUP anterior a el.



Atributos:

ALIGN="..."--Especifica la posición del texto dentro de la columna. Los parámetros son; CENTER,
LEFT, RIGHT, BOTTOM, o TOP.

SPAN="..."--Indica las colunas donde se aplica.
<TBODY>...< /TBODY>(IE)

Encierra el cuerpo de la tabla. Este comando es opcional si se usan los comandos THEAD o TFOOT.
Util para separar las filas de la tabla de el encabezado y el pie de tabla.



<TFOOT>...< /TFOOT>(IE)

Encierra las filas que van a ser usadas como pie de tabla. Se usa despues del comando TBODY.



<THEAD>...< /THEAD>(IE)

Encierra las filas que serán usadas como encabezado. Se usa antes del comando TBODY.



Formularios (Forms):

<FORM atributo1="..." atributo2="...">.....< /FORM>

Especifica un formulario (Form). Estos se usan para enviar información a un servidor.

Atributos:

ACTION="..."--Especifica la dirección de la acción de salida del Form. Usualmente es la dirección de
un archivo CGI. También se puede especificauna dirección de correo.

METHOD="..."--Indica el metodo usado para enviar la información. Los valores posibles son: POST
o GET. Cuando se usa GET, el servido adjunta los argumentos al final de la dirección fijada en
ACTION. Cuando se usa POST, La información es enviada como un formato HTTP.

TARGET="..."--Especifica la ventana donde se mostrará la información. El target puede ser un
frame previamente definido o uno de los valores siguientes:

Valores:



"_blank"--Muestra el resultado en un página en blanco.

"_parent"--Muestra el resultado en la pagina que lo invocó.

"_self"--Muestra el resultado en la misma ventana. (por omisión)
"_top"--Muestra el resultado en la ventana actual usando todo el espacio.



ENCTYPE="..."--En browser futuros. Especifica el tipo de codificación.



<INPUT atributo1="..." atributo2="...">

Especifica un control o un area de entrada del formulario, con el cual la información se enviará al
servidor.



Atributos:

ALIGN="..."--Si el tipo es una imagen, especifica el alineamiento del texto alrrededor de la imagen.
Por ejemplo: TOP, MIDDLE, BOTTOM, LEFT, o RIGHT.

CHECKED--Usar este atributo en una caja de tipo RADIO o CHECKBOX, y será preselecionado
cuando se cargue el formulario.

MAXLENGTH="..."--Especifica el máximo número de caracteres en la caja de entrada.

NAME="..."--Especifica el nombre del contro o la caja de entrada. (Parte de la información)

SIZE="..."--Especifica el tamaño del texto que se muestra en la caja de entrada.

SRC="..."--si es una imagen, especifica la ubicación de la imagen.

VALUE="..."--Especifica el valor que se enviará con el nombre correspondiente de la información.
Especifica el texto por omisión (TEXT). Para RESET y SUBMIT, especifica el texto que se mostrará
en el boton tipo 3D.

TYPE="..."--Especifica el tipo de control.

Valores:




CHECKBOX--Crea una caja de chequeo (checkbox). Si el usuario la selecciona, Se envía la
información correspondiente al servidor.

HIDDEN--No se muestra nada, pero la información es enviada de todas maneras.
PASSWORD--Crea una linea de entrada tipo texto, la información aparece representada por * (No
se permite visualizar).

RADIO--Crea una lista de Botones de selección (radio) de los caules solo uno se puede selccionar.
Las alternativas pueden tener el mismo nombre, pero pueden tener valores diferentes.

RESET--Crea un boton 3D que borra el contenido del formulario. Se puede asignar un nombre
diferente a RESET con el atributo VALUE.

SUBMIT--Crea un botón 3D que envía el formulario.

IMAGE--Al igual que el tipo SUBMIT, puede enviar un formulario inmediatamente cuando el
usuario seleccione la imagen. Junto con la información normal, cuando se envía seleccionando la
imagen, las coordenadas del punto de selección (en pixels desde el punto superior izquierdo) se
envían tambien. La coordenada X se envía como ".x" junto a la coordenada Y ".y" al lado del
nombre.

TEXT--Crea una caja de entrada. Se puede especificar el tamaño con el atributo SIZE.



<SELECT atributo1="..." atributo2="...">< /SELECT>

Crea una lisat desplegable (drop-down). Los elementos de la lista se definen con OPTION dentro
del comando SELECT.

Atributos:

MULTIPLE--Especifica que se pueden seleccionar multiples valores.

NAME="..."--Especifica el nombre de la lista.

SIZE="..."--Especifica cuantos elementos serán visibles.

<OPTION value="...">item

Especifica un elemento (Item) en la lista. Cualquier texto puede ser colocado dentro de este
parametro.

VALUE="..."--Especifica el valor que se retornará. (Parte de la información).

SELECTED--Señala al item o elemento pre-seleccionado cuando se cargue la lista.



<TEXTAREA atributo1="..." atributo2="...">...< /TEXTAREA>
Crea una caja de netrada de varias líneas. Cualquier texto dentro de este comando se muestra
como el valor por omisión.



Atributos:

COLS="..."--Especifica la longitud del texto.

ROWS="..."--Especifica el numero de líneas.

NAME="..."--Especifica un nombre a la caja de entrada.

WRAP="..."--Especifica si el texto se truncará. Los valores posibles son "HARD", "SOFT", o "NONE".
EJEMPLO SENCILLO EN HTML



<html>
<head>

<title> EJEMPLO DE PAG WEB </title>

<script type="text/javascript">...</script>

</head>

<body bgcolor="#99CC99" link="#CC0000" vlink="#CC0000" alink="#CC0000" >

<h1> Encabezado de mi primera pagina web</h1>

<pre><fontsize="4" face="Comic Sans MS">Podemos crear un párrafo de cualquier tipo de
informacion<b>resaltando</b> la letra o parte de sus contenidos.
esaqui donde puede escribir los parrafos que desea tablas, listas, formularios, etc, etc</pre>

<font color="#993366" size="10" face="Comic Sans MS"> Sergio Damian Saraguro</font></p>

<imgsrc="Imagenes/unl.png"></p>

<a href="https://plus.google.com/u/0/109460435023019320524/posts">Visita mi perfil en
gmail</a></p>

<marquee bgcolor="#006699" behavior="alternate" direction="right">
<b><font color="#FFFFCC" size="5">Esto es un ejercicio en flash </font></b>
</marquee>

</p></p>


<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><div align="center">

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,
0,29,0" width="600" height="400">
<param name="movie" value="anima.swf" />
<param name="quality" value="high" />
<embed src="anima.swf" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-
flash" width="600" height="400"></embed>
</object>
</div></td>
</tr>
</table>

<table width="50%" border="2" align="center" cellspacing="0" bordercolor="#000000"
bgcolor="#FFCC99">
<tr align="center">
<td><font color="#993366" size="4" face="Comic Sans MS"> NOMBRES         </td>
<td><font color="#993366" size="4" face="Comic Sans MS"> APELLIDOS </td>
</tr>
<tr>
<td>Juan </td>
<td>Perez</td>
</tr>
<tr>
<td>Ana </td>
<td>Castro </td>
</tr>
</table>

</body>
</html>

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

jQuery PPT
jQuery PPTjQuery PPT
jQuery PPT
 
Introduction to Bootstrap
Introduction to BootstrapIntroduction to Bootstrap
Introduction to Bootstrap
 
Basics of JavaScript
Basics of JavaScriptBasics of JavaScript
Basics of JavaScript
 
Html5 tutorial for beginners
Html5 tutorial for beginnersHtml5 tutorial for beginners
Html5 tutorial for beginners
 
Understanding XML DOM
Understanding XML DOMUnderstanding XML DOM
Understanding XML DOM
 
Clean Code
Clean CodeClean Code
Clean Code
 
Clean Code
Clean CodeClean Code
Clean Code
 
Front End Development | Introduction
Front End Development | IntroductionFront End Development | Introduction
Front End Development | Introduction
 
Intro to html 5
Intro to html 5Intro to html 5
Intro to html 5
 
Html basic
Html basicHtml basic
Html basic
 
An Overview of HTML, CSS & Java Script
An Overview of HTML, CSS & Java ScriptAn Overview of HTML, CSS & Java Script
An Overview of HTML, CSS & Java Script
 
Html
HtmlHtml
Html
 
DOM and Events
DOM and EventsDOM and Events
DOM and Events
 
jQuery
jQueryjQuery
jQuery
 
Advanced Web Development
Advanced Web DevelopmentAdvanced Web Development
Advanced Web Development
 
Spring Web Service, Spring Integration and Spring Batch
Spring Web Service, Spring Integration and Spring BatchSpring Web Service, Spring Integration and Spring Batch
Spring Web Service, Spring Integration and Spring Batch
 
Javascript
JavascriptJavascript
Javascript
 
Web development using html 5
Web development using html 5Web development using html 5
Web development using html 5
 
Presentation on HTML
Presentation on HTMLPresentation on HTML
Presentation on HTML
 
Questionário sobre programação oo com java revisão da tentativa
Questionário sobre programação oo com java  revisão da tentativaQuestionário sobre programação oo com java  revisão da tentativa
Questionário sobre programação oo com java revisão da tentativa
 

Similar a Comandos html (20)

Estructuras basicas
Estructuras basicasEstructuras basicas
Estructuras basicas
 
Paula ramirez
Paula ramirezPaula ramirez
Paula ramirez
 
Comandos html
Comandos htmlComandos html
Comandos html
 
significado de Htlm
significado de  Htlm significado de  Htlm
significado de Htlm
 
Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Lenguaje HTML
 
Laura socha niño
Laura socha niñoLaura socha niño
Laura socha niño
 
Etiquetas html
Etiquetas htmlEtiquetas html
Etiquetas html
 
Guia html
Guia htmlGuia html
Guia html
 
Introducción a Html
Introducción a HtmlIntroducción a Html
Introducción a Html
 
Html
HtmlHtml
Html
 
Páginas html
Páginas htmlPáginas html
Páginas html
 
Páginas web con html
Páginas web con htmlPáginas web con html
Páginas web con html
 
Html
HtmlHtml
Html
 
Unidad # 1
Unidad # 1Unidad # 1
Unidad # 1
 
Unidad # 1
Unidad # 1Unidad # 1
Unidad # 1
 
Guia de repaso html11
Guia de repaso html11Guia de repaso html11
Guia de repaso html11
 
LENGUAJE HTML
LENGUAJE HTMLLENGUAJE HTML
LENGUAJE HTML
 
HTML
HTMLHTML
HTML
 
[modo de compatibilidad] HTML
[modo de compatibilidad] HTML[modo de compatibilidad] HTML
[modo de compatibilidad] HTML
 
Documento html estefania aguirre diossa
Documento html estefania aguirre diossaDocumento html estefania aguirre diossa
Documento html estefania aguirre diossa
 

Último

PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxOscarEduardoSanchezC
 
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfvictorbeltuce
 
Fisiologia.Articular. 3 Kapandji.6a.Ed.pdf
Fisiologia.Articular. 3 Kapandji.6a.Ed.pdfFisiologia.Articular. 3 Kapandji.6a.Ed.pdf
Fisiologia.Articular. 3 Kapandji.6a.Ed.pdfcoloncopias5
 
Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressionsConsueloSantana3
 
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDUFICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDUgustavorojas179704
 
Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024IES Vicent Andres Estelles
 
cuadernillo de lectoescritura para niños de básica
cuadernillo de lectoescritura para niños de básicacuadernillo de lectoescritura para niños de básica
cuadernillo de lectoescritura para niños de básicaGianninaValeskaContr
 
PROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docxPROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docxEribertoPerezRamirez
 
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdfEstrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdfAlfredoRamirez953210
 
PPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdfPPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdfEDILIAGAMBOA
 
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdfOswaldoGonzalezCruz
 
CIENCIAS NATURALES 4 TO ambientes .docx
CIENCIAS NATURALES 4 TO  ambientes .docxCIENCIAS NATURALES 4 TO  ambientes .docx
CIENCIAS NATURALES 4 TO ambientes .docxAgustinaNuez21
 
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxLINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxdanalikcruz2000
 
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOTUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOweislaco
 

Último (20)

PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptxPPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
PPT GESTIÓN ESCOLAR 2024 Comités y Compromisos.pptx
 
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
 
Aedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptxAedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptx
 
VISITA À PROTEÇÃO CIVIL _
VISITA À PROTEÇÃO CIVIL                  _VISITA À PROTEÇÃO CIVIL                  _
VISITA À PROTEÇÃO CIVIL _
 
Fisiologia.Articular. 3 Kapandji.6a.Ed.pdf
Fisiologia.Articular. 3 Kapandji.6a.Ed.pdfFisiologia.Articular. 3 Kapandji.6a.Ed.pdf
Fisiologia.Articular. 3 Kapandji.6a.Ed.pdf
 
Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressions
 
Sesión La luz brilla en la oscuridad.pdf
Sesión  La luz brilla en la oscuridad.pdfSesión  La luz brilla en la oscuridad.pdf
Sesión La luz brilla en la oscuridad.pdf
 
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDUFICHA DE MONITOREO Y ACOMPAÑAMIENTO  2024 MINEDU
FICHA DE MONITOREO Y ACOMPAÑAMIENTO 2024 MINEDU
 
Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024Metabolismo 3: Anabolismo y Fotosíntesis 2024
Metabolismo 3: Anabolismo y Fotosíntesis 2024
 
Tema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdf
Tema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdfTema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdf
Tema 7.- E-COMMERCE SISTEMAS DE INFORMACION.pdf
 
cuadernillo de lectoescritura para niños de básica
cuadernillo de lectoescritura para niños de básicacuadernillo de lectoescritura para niños de básica
cuadernillo de lectoescritura para niños de básica
 
La luz brilla en la oscuridad. Necesitamos luz
La luz brilla en la oscuridad. Necesitamos luzLa luz brilla en la oscuridad. Necesitamos luz
La luz brilla en la oscuridad. Necesitamos luz
 
PROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docxPROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docx
 
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdfEstrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
Estrategias de enseñanza - aprendizaje. Seminario de Tecnologia..pptx.pdf
 
Aedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptxAedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptx
 
PPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdfPPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdf
 
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
5° SEM29 CRONOGRAMA PLANEACIÓN DOCENTE DARUKEL 23-24.pdf
 
CIENCIAS NATURALES 4 TO ambientes .docx
CIENCIAS NATURALES 4 TO  ambientes .docxCIENCIAS NATURALES 4 TO  ambientes .docx
CIENCIAS NATURALES 4 TO ambientes .docx
 
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptxLINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
LINEAMIENTOS INICIO DEL AÑO LECTIVO 2024-2025.pptx
 
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJOTUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
TUTORIA II - CIRCULO DORADO UNIVERSIDAD CESAR VALLEJO
 

Comandos html

  • 1. QUE ES HTML? El HTML (Hyper Text MarkupLanguage) es el lenguaje con el que se escriben las páginas web. Es un lenguaje de hipertexto, es decir, un lenguaje que permite escribir texto de forma estructurada, y que está compuesto por etiquetas, que marcan el inicio y el fin de cada elemento del documento. Un documento hipertexto no sólo se compone de texto, puede contener imágenes, sonido, vídeos, etc., por lo que el resultado puede considerarse como un documento multimedia. Los documentos HTML deben tener la extensión html o htm, para que puedan ser visualizados en los navegadores (programas que permiten visualizar las páginas web). Los navegadores se encargan de interpretar el código HTML de los documentos, y de mostrar a los usuarios las páginas web resultantes del código interpretado. Estructura de una página A lo largo de este tema vamos a aprender a crear una página básica. La estructura básica de una página es: <head> ... </head> <body> ... </body> </html> <html>
  • 2. Comandos Básicos < HTML > ... < /HTML > : Indica el comienzo y fin de un archivo HTML < HEAD > ...< /HEAD > : Indica el comienzo y fin de un encabezado (aquí se coloca generalmente el título). < TITLE > ...< /TITLE > : Indica el título. < BODY > ...< /BODY > : Indica el comienzo y fin del cuerpo de la página. < P > ...< /P > : Indica comienzo y fin de un párrafo. < BR > : Permite saltarse una línea (se llama quiebre de línea). <Hn > ...<Hn > : Para n entre 1 y 6, hacen que el texto encerrado aparezca como encabezado (un subtítulo). Se recomienda usar sólo 1,2 y 3. Tipos de letras: o < B > ...< /B > : Negrita. o < L > ...< /L > : Cursiva. o < BLINK > ...< /BLINK > : Parpadeante. o < STRONG > ...< /STRONG > : Enfatizada. < UL > ...< /UL > : Indica comienzo y fin de una lista no ordenada (puntos). Dentro de ellos, cada item empieza por < LI > y termina al terminar la línea. < OL > ...< /OL > : Indica comienzo y fin de una lista ordenada (números). Dentro de ellos, cada item empieza por < LI > y termina al terminar la línea. Ejemplo: < OL > < LI > Primer item < LI > Segundo item < UL > < LI > Primer subitem < LI > Segundo subitem < /UL > < LI > Tercer item < /OL > Y esto se ve 1. Primer item 2. Segundo item  Primer subitem
  • 3.  Segundo subitem 3. Tercer item Gráficos En HTML se pueden incluir gráficos en dos formatos: gif y jpg. Estos formatos son conocidos por los browsers, por lo tanto no es necesario un programa especial para verlos, y se ven directamente en la página junto con el texto. Si se quisieran utilizar otros formatos, se deben ocupar comandos externos al browser para hacerlo. La sintaxis para la inclusión de gráficos es la siguiente: <imgsrc=archivo.{gif,jpg} Nombre del archivo width= Ancho del archivo(en puntos height= Altura del archivos (en puntos) align= Alineación de la imagen y textos (ver más abajo) border= Ancho del borde de la imagen > Por ejemplo: <imgsrc="images/hola.gif" > Produce: La opcion align tiene relación con la posición de la imagen con respecto al texto que viene a continuación. He aquí un ejemplo:
  • 4. Align=top (por defecto) Texto a continuación Align=middle Texto a continuación Align=bottom Texto a continuación Referencias Existen tres tipos principales de referencias a otros textos: Referencias a otras páginas: <a href="otra_pagina.html" >Ir a otra pagina</a> Se ve como: Ir a otra pagina Basta presionar sobre el texto subrayado (y generalmente en otro color) para ir a la otra página Referencias a temas: <a href="#tema" >Ir a otro tema </a> Si se presiona sobre el texto subrayado se va a otra parte de la misma página, que se marcó con la instrucción <a name="tema">.
  • 5. ATRIBUTOS ALINK="..." Especifica el color de las Direcciones activadas en la página. BACKGROUND="..." Especifica el papel tapiz de la página. un Archivo *.jpg o *.gif. BGCOLOR="..."Especifica el Color del Fondo del Documento. Los colores son expresados en formato RGB(Red, Green,Blue), donde cada color tiene un valor desde el 0 (0) hasta el 255 (FF). Amarillo = #FFFF00 Azul = #0000FF Azul Claro = #00CCFF Blanco = #FFFFFF Gris = #CC9999 Lila = #CC33FF Negro = #000000 Rojo = #FF0000 Verde = #00FF00 BGPROPERTIES=FIXED Fija la imagen del Fondo para que no se desplace. (IE) LEFTMARGIN="..." Especifica el margen Izquierdo de todo el documento.(IE) LINK="..." Especifica el color de las direcciones contenidas en el documento. TEXT="..." Especifica el Color del texto. TOPMARGIN="..." Fija el margen superior de todo el Documento.(IE) VLINK="..." Especifica las direcciones visitadas, incluidas en el Documento. <BASEFONT atributo= " ">
  • 6. Fija los atributos de escritura en toda la página. ATRIBUTOS SIZE="..." Fija el tamaño de las Letras, se usa un número entre 1 y 7 donde el 3 es el tamaño por omisión. Tambien permite tamaños relativos, e.j. SIZE=+2 . COLOR="..." Especifica el color de las Letras en todo el Documento. NAME="..." Especifica el tipo de apariencia de la Letra en todo el Documento. <Hn>...< /Hn> Especifica un encabezado de texto de varios tamaños, n indica los tamaños de 1 a 6, 1 es el más grande y 6 es el más pequeño. <ISINDEX> Muestra un diálogo de indice de busqueda. Con este comando solamente no se puede crear una pagina de busqueda, el Servidor debe ser configurado para soportarlo. Atributos: ACTION="..." Especifica la ubicación del puerto del programa donde se pasará los parámetros de busqueda. PROMPT="..." Especifica un mensaje alterno para el diálogo. Formato General: <ADDRESS>.....< /ADDRESS> Encierra el archivo de firma del autor de la página. El texto se muestra en Italicas. <B>...< /B> Resalta en Negritas el Texto encerradot.
  • 7. <BIG>...< /BIG> Incrementa el tamaño del Texto. <BLINK>.....< /BLINK> Hace el texto parapadeante. <BLOCKQUOTE>.....< /BLOCKQUOTE> Encierra un enfasis. El margen izquierdo y derecho están indentados. <BR> Inserta un final de línea. Atributos: CLEAR="..."--Causa que el texto alrededor de la imagen se elimine. Los valores posibles son: RIGHT, LEFT, o ALL. <CENTER>.....< /CENTER> Centra los objetos que contiene. Este comando puede centrar cualquier cosa incluyendo imagenes, texto, tablas, formularios, etc. <CITE>.....< /CITE> Encierra una Cita como un titulode un libro,etc. <CODE>.....< /CODE> Encierra Codigo de ejemplo. El texto se muestra en letras pequeñas.
  • 8. <COMMENT>.....< /COMMENT> Define un comentario. Todo el texto es ignorado aun si incluye codigo HTML. <DFN>.....< /DFN> Encierra una definición. El texto dentro de este comando se formatea como una definición. <DIV ALIGN=">...< /DIV> Especifica el alineamiento de los elementos que contiene. Se puede usar para dividir el documento que tiene secciones alineadas en forma diferente. Atributos: ALIGN="..."--Fija el alineaminto. Por ejemplo: "center", "right", o "left". <EM>...< /EM> El texto se muestra en cursivas (Itálicas). <FONT atributo=">...< /FONT> Fija las propiedades y el tipo de letra del texto que contiene. Atributos: SIZE="..."--Fija el tamaño de las letras desde valores entre 1 y 7 donde 3 es el valor por omisión. Se puede especificar valores relativos, ejemplo. SIZE=+3 . COLOR="..."--Especifica el color de las letras. FACE="..."--Especifica el tipo de letra. Se puede definir una lista separada por comas. Por ejemplo: Arial, Verdana, etc.
  • 9. <HR atributo1="..." atributo2="..."> Inserta una líea horizontal. Atributos: SIZE="..."--Especifica el grosor de la línea. COLOR="..."--Especifica el color de la línea.(IE) WIDTH="..."--Especifica la longitud de la línea como porcentaje de la página, ejemplo. WIDTH=70% . ALIGN="..."--Especifica el alineamiento: RIGHT, LEFT, o CENTER. NOSHADE--Muestra la línea como sólido. <I>...< /I> Presenta el texto encerrado como Itálicas. <KBD>...< /KBD> Especifica el texto a ser entrado por teclado. El texto se muestra en negritas y de tamaño fijo. <LISTING>.....< /LISTING> Muestra texto en tamaño fijo. Obsoleto -- se usa el comando PRE. <MULTICOL>.....< /MULTICOL> Muestra un texto en columnas. Atributos: COLS="..."--Especifica el numero de columnas. GUTTER="..."--Especifica el numero de pixels entre columnas.
  • 10. WIDTH="..."-- Especifica el ancho de las columnas. <NOBR>.....< /NOBR> El texto que lo contiene no se trunca en la pantalla. <P atributo>...< /P> Diseñado para encerrar texto de un parrafo. El cierre es opcional. Atributos: ALIGN="..."--Especifica el alineamiento del parrafo. Por ejemplo:"center", "left", o "right". <PLAINTEXT>.....< /PLAINTEXT> Muestra el texto sin formato aun cuando contenga comandos de HTML. Obsoleto -- Se usa el comando PRE. <PRE>.....< /PRE> Muestra texto sin formato, sin eliminar espacios y saltos. <S>.....< /S> Muestra el texto con una línea por el centro (tachado). Es diferente al comando <STRIKE>. <SAMP>...< /SAMP> Indica un ejemplo de salida para un formulario o programa. El texto se muestra en tamaño pequeño. <SMALL>...< /SMALL>
  • 11. Muestra el texto en tamaño pequeño. <SPACER atributo>...< /SPACER> (Netscape) Inserta bloques de espacios en la página. Atributos: ALIGN="..."--Cuando el tipo es de Bloque (BLOCK) especifica el alineamiento del texto alrededor. Valores: RIGHT o LEFT--Alinea el bloque de espacios en el lado especificado, y el texto se trunca alrededor del bloque. TOP, MIDDLE, BOTTOM, TEXTTOP, ABSMIDDLE, BASELINE, y ABSBOTTOM--Especifica el alineaminto vertical del bloque con cualquier elemento el la misma línea. HEIGHT="..."--Cuando el tipo es BLOCK, especifica la altura del bloque. SIZE="..."--Cuando el tipo es HORIZONTAL, o VERTICAL, especifica el tamaño del espacio. TYPE="..."--Especifica el tipo de espacio. Valores: HORIZONTAL--Inserta espacios en blanco entre palabras. VERTICAL--Inserta espacios entre dos líneas. BLOCK--Inserta un bloque de espoacios rectangular, muchos usan el comando IMG. WIDTH="..."--Cuando el tipo es BLOCK, especifica el ancho del bloque. <STRONG>...< /STRONG>
  • 12. Muestra el texto en negritas, resaltado. <SUB>...< /SUB> Muestra el texto encerrado como un subindice. <SUP>...< /SUP> Muestra el texto encerrado como superindice. <TT>...< /TT> Muestra el texto en formato teletipo. <U>...< /U> Muestra el texto subrayado. No use este comando puede confundir con una dirección o Link. <VAR>...< /VAR> Especifica una variable. Eltexto se muestra en letras pequeñas y de tamaño fijo. <WBR> Hace que el texto que contiene, se trunque si es necesario. <XMP>...< /XMP> Hace que el texto encerrado se muestre sin procesar los coamdos HTML que contenga. Obsoleto -- Se usa el comando PRE. Master Thian
  • 13. Master Thian Administrador Cantidad de envíos: 2332 Edad: 19 Localización: Santiago-Chile Estrellas: Respeto de las normas del foro: Estado Nivel: 14 experiencia: (63/185) Clan: DarKneS Mensaje n°2 Mutimedia por Master Thian el Mar Abr 22, 2008 5:48 am Multimedia: <IMG atributo1 atributo2> Coloca una imagen el en documento. Atributos: SRC="..." Especifica la ubicación de la Imagen.
  • 14. DYNSRC="..." Especifica la ubicación de un video o un mundo VRML. Se puede soportar una imagen usando el SRC de primero para aquellos Browser que no soportan Videos. (IE) CONTROLS Activa una serie de controles de Video. (IE) LOOP="n" Para videos, especifica en número de repetición del video. Un valor de "-1" o "INFINITE" repite el video indefinidamente. (IE) START="..." Especifica el momento inicial de reproducción del video. Se puede usar "FILEOPEN" por omisión, "MOUSEOVER", o ambos. (IE) USEMAP="#map1" Dice al Browser que use la imagen como una interface de selección definida con el nombre de "map1". ISMAP Dice al Browser que la imagen es un mapa de Selección. ALT="..." Especifica un texto que se muestra en los Browser que no soportan imagenes. BORDER="..." Especifica el ancho del borde alrededor de la imagen. Si BORDER es "0", No presenta bordes en la imagen. LOWSRC="..."--Especifica la Direeción de la imagen que se cargará primero antes de que la imagen sea cargada. LOWSRC usualmente se refiere a una imagen pequeña. ALIGN="..."--especifica el alineamiento de la imagen. Valores: RIGHT o LEFT--Alinea a un lado especifico de la página, y todo el texto se justifica al lado de la imagen. TOP, MIDDLE, BOTTOM, TEXTTOP, ABSMIDDLE, BASELINE, y ABSBOTTOM--Especifica el alineamiento vertical de la imagen. VSPACE="..."--Especifica el espacio entre el borde de la imagen y los items encima o debajo de ella. HSPACE="..."--Especifica el espacio entre el borde de la imagen y los items a la derecha e izquierda. WIDTH="..."--Especifica el ancho de la imagen. Si el tamaño no coincide con el original se ajusta. HEIGHT="..."--Igual al anterior pero con la altura.
  • 15. <MAP atributo>...< /MAP> Especifica los puntos de selección de una imagen. El comando AREA se usa para definir las coordenadas. Atributos: NAME="..."--Especifica el nombre del mapa para ser usado después. <AREA atributo1 atributo2>...< /AREA> Especifica la silueta y el tamaño del area de selección elel mapa que se muestra. Se usa dentro del comando MAP. Atributos: SHAPE="..."--Especifica la Silueta del area de selección. Los valores posibles son RECT, RECTANGLE, CIRC, CIRCLE, POLY, o POLYGON. COORDS="..."--Especifica la coordenada de la silueta. Dos pares de coordenadas indican un rectangulo, tres o mas pares definen un poligono, y un par de coordenadas y un radio define un Circulo. HREF="..."--Especifica la dirección donde apunta el area del mapa. NOHREF--Indica que esta silueta no apunta a una dirección. TARGET="..."--Especifica la ventana donde se mostrará la página. El target puede ser el nombre de un Frame o alguno de los siguientes valores: "_blank"--Muestra la dirección en un página en blanco. "_parent"--Muestra la dirección en la pagina que lo invocó. "_self"--Muestra la dirección en la misma ventana. (poromisioón) "_top"--Muestra la dirección en la ventana actual usnado todo el espacio.
  • 16. <MAP atributo>...< /MAP> Especifica los puntos de selección de una imagen. El comando AREA se usa para definir las coordenadas. Atributos: NAME="..."--Especifica el nombre del mapa para ser usado después. <AREA atributo1 atributo2>...< /AREA> Especifica la silueta y el tamaño del area de selección elel mapa que se muestra. Se usa dentro del comando MAP. Atributos: SHAPE="..."--Especifica la Silueta del area de selección. Los valores posibles son RECT, RECTANGLE, CIRC, CIRCLE, POLY, o POLYGON. COORDS="..."--Especifica la coordenada de la silueta. Dos pares de coordenadas indican un rectangulo, tres o mas pares definen un poligono, y un par de coordenadas y un radio define un Circulo. HREF="..."--Especifica la dirección donde apunta el area del mapa. NOHREF--Indica que esta silueta no apunta a una dirección. TARGET="..."--Especifica la ventana donde se mostrará la página. El target puede ser el nombre de un Frame o alguno de los siguientes valores: "_blank"--Muestra la dirección en un página en blanco. "_parent"--Muestra la dirección en la pagina que lo invocó. "_self"--Muestra la dirección en la misma ventana. (poromisioón) "_top"--Muestra la dirección en la ventana actual usnado todo el espacio.
  • 17. <BGSOUND atributo1 atributo2> (IE) Reproduce un archivo de sonidos en el fondo cuando la página es cargada. Este archivo de sonido puede ser de tipo (.wavor .au) o midi (.mid). Atributos: SRC="..."-- indica el archivo de musica. LOOP="n"-- Indica el numero de veces que se repite. Un valor de "-1" o "INFINITE" indica una reproducción sin interrupción. <MARQUEE atributo1 atributo2>...< /MARQUEE> (IE) Fija un texto que se desplaza por la pantalla. Atributos: ALIGN="..."-- Especifica el alineaminto del texto. Loa valores posibles son "TOP", "MIDDLE", o "BOTTOM". BEHAVIOR="..."--Indica la forma de presentación "SCROLL" (omisión), "SLIDE", o "ALTERNATE". "SLIDE" hace que el texto se desplaze afuera y adentro , "ALTERNATE" muestra el texto adelante y atras repetidamente. BGCOLOR="..."-- Fija el color de fondo. DIRECTION="..."--Indica la Dirección "LEFT" (omisión) o "RIGHT". HEIGHT="..."-- Fija la altura del texto en Pixels o %. HSPACE="n"--Fija el margen en espacios a la derecha e izquierda del texto. LOOP="n"-- Fija el numero de repeticiones. Un valor de "-1" o "INFINITE" repite indefinidamente. SCROLLAMOUNT="n"-- Fija el Numero de pixel entre cada display. SCROLLDELAY="n"--Indica el tiempo de espera para mostrar cada texto.
  • 18. VSPACE="n"-- Fija el margen superior e inferior del texto. WIDTH="..."-- Fija el ancho del Marquee en pixels o %. <APPLET atributo1 atributo2> parametros1 parametros2 ...< /APPLET> Inserta un applet de Java en el documento. Cualquier texto dentro del comando APPLET se mostrará en los browser que no soportan JAVA. Atributos: ALIGN="..."-- Fija el alineamiento del applet, los parametros son "LEFT", "RIGHT", "TOP", "MIDDLE", o "BOTTOM". ALT="..."--Muestra un mensaje cuando el brwoser no puede ejecutar el applet. CODE="..."--Especifica el nombre del applet. CODEBASE="..."--Especifica la dirección de inicio del applet. El directorio donde se encuentra el applet. DOWNLOAD=n--Especifica el orden de descarga de la imagenes. HIGHT="..."--Especifica la altura del applet en pixels o %. HSPACE="n"--Especifica los margenes en espacios fuera del applet en pixels. NAME="..."-- Indica el nombre de un applet (rutina), si hay masapplets en una misma página. VSPACE="n"--Especifica el margen superio e inferior del applet. WIDTH="..."--Fija el ancho del applet en pixel o en %. Parametros: Estos son los parametros especificaos de cada applet, que son pasasdos como argumentos. Se expresan como comandos así <PARAM NAME="..." VALUE="..." >
  • 19. <EMBED atributo1 atributo2>< /EMBED> Inserta un objeto multimedia, como un corto de video o sonido, en la página. En los browser modernos se mantiene por compatibilidad. Atributos: AUTOSTART="..."--Especifica si iniciar la ejecución o No."TRUE" o "FALSE". HIGHT="..."-- Especifica el tamañ en pixels o %. LOOP="..."-- Fija el numero de repeticiones. Los valores son "TRUE" o "FALSE". NAME="..."-- Indica el nombre del Objeto, en caso de haber otros en la página. SRC="..."-- Indica la ubicación del archivo. WIDTH="..."--Especifica el ancho donde se mostrará el objeto. <SCRIPT atributo> ...sentencias script ... < /SCRIPT> Encierra el codigo de programación que se ejecuta en la pagina. Para matener compatibilidad los comandos están marcados como cometarios, (<!-- comandos script... -->) Atributos: LANGUAGE="..."--Especifica el elnguaje usado en el script, como "VBScript" Visual Basic Script o "JavaScript" Java Script. b> SRC="..."-- Indica la ubicación del archivo que contiene un script. Se usa si ud. no quiere tener el codigo de programación en la página. <NOSCRIPT> ...< /NOSCRIPT> Muestra todo lo que quiera diferente a codigo de programación. Este comando va dentro del comando SCRIPT. Direcciones (Links):
  • 20. <A atributo="...">...< /A> Cuando se usa con el atributo HREF, el texto o la grafica apunta a otro documento o función. Cuando se usa el atributo NAME, el texto o la grafica identifica el nombre del documento. Atributos: HREF="..."--Especifica la URL (ubicación) al documento señalado. NAME="..."--Especifica el nombre del encadenamiento. onClick="-- Especifica un codigo script cunado se hace click con el mouse. onMouseOver="--Activa un codigo script cuando el mouse está sobre el link. REL="..."-- Especifica una relación Directa. REV="..."--Especifica una relación Inversa. TARGET="..."--Especifica la ventana donde se mostrará la página. El contenido puede ser el nombre de un Frame pre-definido o alguno como sigue: Valores: "_blank"--Carga la página en una ventana en blanco. "_parent"--Craga la página en la ventana del documento que lo llamó. "_self"--Carga la página en la misma ventana. (Omisión) "_top"--Carga la página en toda la ventana, sin importar el frame. TITLE="..."--Especifica una leyenda que aparece cuando se ubica sobre el link, pero que aun no se ha seleccionado. Listas (Lists:):
  • 21. <LI atributo> Este comando enumera los parrafos como una lista de palabras usando los siguientes sub- comandos: <DIR>,<MENU>, <OL>, o <UL>. Atributos: TYPE="..." --Especifica el tipo de indicador de la lista. Los valores mas comunes son: DISC, CIRCLE, SQUARE, A, a, I, i, 1. VALUE="..."--Especifica el valor asignado a un item. <DIR>...< /DIR> Convierte el texto encerrado por <LI>, en una lista de directorio. <MENU>...< /MENU> Convierte el texto encerrado por <LI>, en una lista de menus. <OL atributo>...< /OL> Convierte al texto encerrado por <LI>, en una lista numerada. Atributos: TYPE="..."--Especifica el tipo de numeracion para el indicador. Un tipo de indicador sería: A, a, I, i, 1. START="..."--Especifica el valor inicial de la numeración. <UL atributo>...< /UL> Convierte el texto encerrado por <LI>, en una lista indicada.
  • 22. Atributos: TYPE="..."--Especifica el tipo de indicador para la lista. Los valores comunes son: DISC, CIRCLE, SQUARE. <DL>...< /DL> Crea una lista definida. Donde, <DT> especifica un termino de la lista y <DD> especifica el contenido del termino. Particiones de Ventanas (Frames): <FRAMESET atributo1="..." atributo2="...">...< /FRAMESET> Define una serie de ventanas que forman una página. Los comandos FRAME, y NOFRAMES van dentro de FRAMESET. El comando FRAMESET se usa como el comando BODY. Se puede incluir un comando BODY dentro del comando NOFRAMES para aquellos browser que no soportan frames. Atributos: BORDER="..."--Indica el ancho (en pixels) del borde alrededor del frame.(Netscape) COLS="..."--Crea el frame como columnas y fija el tamaño de cada columna. El ancho se puede expresar en %, pixels, o en tamaño relativo (*). Por ejemplo, Si usted queire 3 frames de igual tamaño en forma de columna use el atributo COL así: COLS=33%,33%,* FRAMEBORDER="..."--Especifica si se muestra el borde del frame en 3D o No. Los valores comunes son; 0 (sin borde) o 1 (Omisión).(IE) FRAMESPACING="..."--Especifica la separación en pixels entre frames. ROWS="..."--Al igual que COLS especifica frames en forma de filas. Por ejemplo, si desea un pequeño frame arriba de la página y uno grande debajo el atributo ROWS sería: ROWS=15%,*
  • 23. SCROLLING="..."--Indica si los frames llevan barra de desplazamiento. Los valores mas comunes son "yes", "no", y "auto". <FRAME atributo1="..." atributo2="..."> Define un frame simple. Atributos: BORDER="..."--Especifica el ancho en pixels del borde alrededor del frame.(Netscape) FRAMEBORDER="..."--Especifica si se muestra el borde del frame en 3D o No. Los valores comunes son; 0 (sin borde) o 1 (Omisión).(IE) MARGINHEIGHT="..."--Especifica los margenes superior e inferior. MARGINWIDTH="..."--Especifica el margen izquierdo y derecho. NAME="..."--Asigna un nombre al frame. NORESIZE--Impide que el usuario cambie el tamaño. SCROLLING="..."--Indica si los frames llevan barra de desplazamiento. Los valores mas comunes son "yes", "no", y "auto". SRC="..."--Indica el archivo que contiene el frame. <IFRAME atributo1="..." atributo2="...">< /IFRAME> (IE) Define un frame eventual. No necesita el comando FRAMESET. Atributos: ALIGN="..."--Especifica la posicion del texto alrededor del frame. Los valoresposibles son TOP, MIDDLE, BOTTOM, LEFT, y RIGHT. FRAMEBORDER="..."--Especifica si se muestra el borde del frame en 3D o No. Los valores comunes son; 0 (sin borde) o 1 (Omisión).(IE) HEIGHT="..."--Especifica la altura del frame eventual.
  • 24. MARGINHEIGHT="..."--Especifica los margenes superior e inferior. MARGINWIDTH="..."--Especifica el margen izquierdo y derecho. NAME="..."--Asigna un nombre al frame. NORESIZE--Impide que el usuario cambie el tamaño. SCROLLING="..."--Indica si los frames llevan barra de desplazamiento. Los valores mas comunes son "yes", "no", y "auto". SRC="..."--Indica el archivo que contiene el frame. WIDTH="..."--Especifica el ancho del frame eventual. <NOFRAMES>...< /NOFRAMES> Se utiliza dentro de FRAMESET, cualquier objeto dentro de este comando se ve solo en browsers que no soportan frames. _________________ Mi mejor firma =) Master Thian Master Thian Administrador
  • 25. Cantidad de envíos: 2332 Edad: 19 Localización: Santiago-Chile Estrellas: Respeto de las normas del foro: Estado Nivel: 14 experiencia: (63/185) Clan: DarKneS Mensaje n°3 Tablas por Master Thian el Mar Abr 22, 2008 5:49 am TABLAS <TABLE atributo1="..." atributo2="...">...< /TABLE> Crea tablas compuesta por filas y columnas. Atributos: BORDER="..."--Especifica el ancho del borde alrededor de la tabla. Si se fija en 0, no presenta bordes. BACKGROUND="..."--Usa una imagen para el fondo de la tabla.(IE)
  • 26. BGCOLOR="..."--Fija el color de fondo de la tabla. BORDERCOLOR="..."--Fija el color del borde. BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE) BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE) WIDTH="..."--Especifica el ancho de la tabla en la página. CELLSPACING="..."--Especifica los espacios entre las celdas. CELLPADDING="..."--Especifica los espacios entre la celda y el texto. FRAME="..."--Especifica el borde que se debe mostrar.(IE) Tipos Posibles: VOID--No muestra los bordes exteriores. ABOVE--Muestra el borde encima de la tabla. BELOW--Muestra el borde debajo de la tabla. HSIDES--Muestra los bordes superio e inferior de la tabla. LHS--Muestra el borde de la izquierda. RHS--Muestra el borde de la derecha. VSIDES--Muestra el borde derecho e izquierdo. BOX--Muestra todos los bordes de la tabla. BORDER--Muestra un borde en todos los lados de la tabla. HEIGHT="..."--Especifica la altura de la tabla en la página. RULES="..."--Especifica los bordes internos.(IE) Tipos Posibles: NONE--No muestra los bordes internos.
  • 27. GROUPS--Muestra los bordes como si fueran varias tablas y grupos THEAD, TFOOT, TBODY, y COLGROUP. ROWS--Muestra los bordes entre filas. COLS--Muestra los bordes entre columnas. ALL--Muestra todos los bordes tanto filas como columnas. <CAPTION atributo1="...">...< /CAPTION> Especifica una titulo para la tabla. Atributos: ALIGN="..."--Fija la posición del titulo. los valores usados son:LEFT, RIGHT, BOTTOM, o TOP. <TR atributo1="..." atributo2="...">...< /TR> Especifica los datos en filas de una tabla. Puede encerrar el encabezado y los datos. Atributos: ALIGN="..."--Indica el alineamiento de los datos en la fila. Por ejemplo; LEFT, RIGHT, y CENTER. BGCOLOR="..."--Fija un color de fondo para una fila. BORDERCOLOR="..."--Fija el color del borde de la fila. BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE) BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE) VALIGN="..."--Fija el alineaminto vertical de los datos en la fila. Los valores son; TOP, MIDDLE, BOTTOM, y BASELINE. HEIGHT="..."--Especifica el alto de la celda. <TH atributo1="..." atributo2="...">...< /TH>
  • 28. Convierte una celda en encabezado de la tabla. Atributos: ALIGN="..."--Indica el alineamiento de los datos en la fila. Por ejemplo; LEFT, RIGHT, y CENTER. BGCOLOR="..."--Fija un color de fondo para una fila. BORDERCOLOR="..."--Fija el color del borde de la fila. BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE) BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE) VALIGN="..."--Fija el alineaminto vertical de los datos en la fila. Los valores son; TOP, MIDDLE, BOTTOM, y BASELINE. HEIGHT="..."--Especifica el alto de la celda. NOWRAP--Previene el truncamineto del texto en la celda. ROWSPAN="..."--Especifica el numero de filas a unir. COLSPAN="..."--Especifica el numero de Columnas a unir. WIDTH="..."--Especifica el ancho de la celda. <TD atributo1="..." atributo2="..."> Se usa dentro del comando TR y define los datos en una celda. Se puede usar el cierre del comando. Atributos: BACKGROUND="..."--Usa una imagen para el fondo de la celda.(IE) BGCOLOR="..."--Fija el color de fondo de la celda. BORDERCOLOR="..."--Fija el color del borde. BORDERCOLORLIGHT="..."--Fija el color claro del borde para el efecto 3D.(IE) BORDERCOLORDARK="..."--Fija el color obscuro del borde para el efecto 3D.(IE)
  • 29. WIDTH="..."--Especifica el ancho de la tabla en la página. HEIGHT="..."--Especifica el alto de la celda. NOWRAP--Previene el truncamineto del texto en la celda. ROWSPAN="..."--Especifica el numero de filas a unir. COLSPAN="..."--Especifica el numero de Columnas a unir. WIDTH="..."--Especifica el ancho de la celda. VALIGN="..."--Fija el alineaminto vertical de los datos en la fila. Los valores son; TOP, MIDDLE, BOTTOM, y BASELINE. ALIGN="..."--Especifica el alineamiento horizontal de la celda. Los parametros son; LEFT, RIGHT, and CENTER. <COLGROUP atributo1="..." atributo2="...">(IE) Especifica las propiedades de una o mas columnas. Este comando va despues del comando TABLE. Atributos: ALIGN="..."--Especifica la posición del texto dentro de la columna. Los parámetros son; CENTER, LEFT, RIGHT, BOTTOM, o TOP. SPAN="..."--Indica las colunas donde se aplica. <COL atributo1="..." atributo2="...">(IE) Se usa con el comando COLGROUP, y especifica la propiedad de una columna. Este comando omite cualquier atributo del comando COLGROUP anterior a el. Atributos: ALIGN="..."--Especifica la posición del texto dentro de la columna. Los parámetros son; CENTER, LEFT, RIGHT, BOTTOM, o TOP. SPAN="..."--Indica las colunas donde se aplica.
  • 30. <TBODY>...< /TBODY>(IE) Encierra el cuerpo de la tabla. Este comando es opcional si se usan los comandos THEAD o TFOOT. Util para separar las filas de la tabla de el encabezado y el pie de tabla. <TFOOT>...< /TFOOT>(IE) Encierra las filas que van a ser usadas como pie de tabla. Se usa despues del comando TBODY. <THEAD>...< /THEAD>(IE) Encierra las filas que serán usadas como encabezado. Se usa antes del comando TBODY. Formularios (Forms): <FORM atributo1="..." atributo2="...">.....< /FORM> Especifica un formulario (Form). Estos se usan para enviar información a un servidor. Atributos: ACTION="..."--Especifica la dirección de la acción de salida del Form. Usualmente es la dirección de un archivo CGI. También se puede especificauna dirección de correo. METHOD="..."--Indica el metodo usado para enviar la información. Los valores posibles son: POST o GET. Cuando se usa GET, el servido adjunta los argumentos al final de la dirección fijada en ACTION. Cuando se usa POST, La información es enviada como un formato HTTP. TARGET="..."--Especifica la ventana donde se mostrará la información. El target puede ser un frame previamente definido o uno de los valores siguientes: Valores: "_blank"--Muestra el resultado en un página en blanco. "_parent"--Muestra el resultado en la pagina que lo invocó. "_self"--Muestra el resultado en la misma ventana. (por omisión)
  • 31. "_top"--Muestra el resultado en la ventana actual usando todo el espacio. ENCTYPE="..."--En browser futuros. Especifica el tipo de codificación. <INPUT atributo1="..." atributo2="..."> Especifica un control o un area de entrada del formulario, con el cual la información se enviará al servidor. Atributos: ALIGN="..."--Si el tipo es una imagen, especifica el alineamiento del texto alrrededor de la imagen. Por ejemplo: TOP, MIDDLE, BOTTOM, LEFT, o RIGHT. CHECKED--Usar este atributo en una caja de tipo RADIO o CHECKBOX, y será preselecionado cuando se cargue el formulario. MAXLENGTH="..."--Especifica el máximo número de caracteres en la caja de entrada. NAME="..."--Especifica el nombre del contro o la caja de entrada. (Parte de la información) SIZE="..."--Especifica el tamaño del texto que se muestra en la caja de entrada. SRC="..."--si es una imagen, especifica la ubicación de la imagen. VALUE="..."--Especifica el valor que se enviará con el nombre correspondiente de la información. Especifica el texto por omisión (TEXT). Para RESET y SUBMIT, especifica el texto que se mostrará en el boton tipo 3D. TYPE="..."--Especifica el tipo de control. Valores: CHECKBOX--Crea una caja de chequeo (checkbox). Si el usuario la selecciona, Se envía la información correspondiente al servidor. HIDDEN--No se muestra nada, pero la información es enviada de todas maneras.
  • 32. PASSWORD--Crea una linea de entrada tipo texto, la información aparece representada por * (No se permite visualizar). RADIO--Crea una lista de Botones de selección (radio) de los caules solo uno se puede selccionar. Las alternativas pueden tener el mismo nombre, pero pueden tener valores diferentes. RESET--Crea un boton 3D que borra el contenido del formulario. Se puede asignar un nombre diferente a RESET con el atributo VALUE. SUBMIT--Crea un botón 3D que envía el formulario. IMAGE--Al igual que el tipo SUBMIT, puede enviar un formulario inmediatamente cuando el usuario seleccione la imagen. Junto con la información normal, cuando se envía seleccionando la imagen, las coordenadas del punto de selección (en pixels desde el punto superior izquierdo) se envían tambien. La coordenada X se envía como ".x" junto a la coordenada Y ".y" al lado del nombre. TEXT--Crea una caja de entrada. Se puede especificar el tamaño con el atributo SIZE. <SELECT atributo1="..." atributo2="...">< /SELECT> Crea una lisat desplegable (drop-down). Los elementos de la lista se definen con OPTION dentro del comando SELECT. Atributos: MULTIPLE--Especifica que se pueden seleccionar multiples valores. NAME="..."--Especifica el nombre de la lista. SIZE="..."--Especifica cuantos elementos serán visibles. <OPTION value="...">item Especifica un elemento (Item) en la lista. Cualquier texto puede ser colocado dentro de este parametro. VALUE="..."--Especifica el valor que se retornará. (Parte de la información). SELECTED--Señala al item o elemento pre-seleccionado cuando se cargue la lista. <TEXTAREA atributo1="..." atributo2="...">...< /TEXTAREA>
  • 33. Crea una caja de netrada de varias líneas. Cualquier texto dentro de este comando se muestra como el valor por omisión. Atributos: COLS="..."--Especifica la longitud del texto. ROWS="..."--Especifica el numero de líneas. NAME="..."--Especifica un nombre a la caja de entrada. WRAP="..."--Especifica si el texto se truncará. Los valores posibles son "HARD", "SOFT", o "NONE".
  • 34. EJEMPLO SENCILLO EN HTML <html> <head> <title> EJEMPLO DE PAG WEB </title> <script type="text/javascript">...</script> </head> <body bgcolor="#99CC99" link="#CC0000" vlink="#CC0000" alink="#CC0000" > <h1> Encabezado de mi primera pagina web</h1> <pre><fontsize="4" face="Comic Sans MS">Podemos crear un párrafo de cualquier tipo de informacion<b>resaltando</b> la letra o parte de sus contenidos. esaqui donde puede escribir los parrafos que desea tablas, listas, formularios, etc, etc</pre> <font color="#993366" size="10" face="Comic Sans MS"> Sergio Damian Saraguro</font></p> <imgsrc="Imagenes/unl.png"></p> <a href="https://plus.google.com/u/0/109460435023019320524/posts">Visita mi perfil en gmail</a></p> <marquee bgcolor="#006699" behavior="alternate" direction="right"> <b><font color="#FFFFCC" size="5">Esto es un ejercicio en flash </font></b> </marquee> </p></p> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td><div align="center"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6, 0,29,0" width="600" height="400"> <param name="movie" value="anima.swf" /> <param name="quality" value="high" /> <embed src="anima.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave- flash" width="600" height="400"></embed> </object>
  • 35. </div></td> </tr> </table> <table width="50%" border="2" align="center" cellspacing="0" bordercolor="#000000" bgcolor="#FFCC99"> <tr align="center"> <td><font color="#993366" size="4" face="Comic Sans MS"> NOMBRES </td> <td><font color="#993366" size="4" face="Comic Sans MS"> APELLIDOS </td> </tr> <tr> <td>Juan </td> <td>Perez</td> </tr> <tr> <td>Ana </td> <td>Castro </td> </tr> </table> </body> </html>