Curso Basico HTML

Repblica Bolivariana de Venezuela Ministerio de Educacin Superior Instituto Universitario de Tecnologa Valencia Departamento de Informtica
q Lenguaje de Hipertexto a travs de marcas . q Lenguaje interpretado basado en etiquetas o TAGS, que hacen referencia a un comando. q<TAG>Elementos afectados</TAG> u 
HTML (HyperText Markup Language)
ENERO 2004
IUTVAL
ING. MAYBEL GIL u<center> ...</center>

u ... 
u<IMG> u Etiqueta vaca []
GUIA TERICA LENGUAJES COMERCIALES HTML
Editor
ENERO 2004
IUTVAL
DOCUMENTO HTML
 Curso Bsico HTML 
Salvar
Profesor
: DELY M. GIL A. VALENCIA, 2004

Curso Bsico HTML
ING. MAYBEL GIL
Primero.htm
Browser
IUTVAL Seccin: 02-a
Lenguajes Comerciales Prof . Maybel Gil
ESTRUCTURA DE UNA PGINA WEB HTML

<HTML> <HEAD>  u No se despliega en el Browser pero si en el cdigo
ING. MAYBEL GIL

2
IUTVAL Seccin: 02-a
q Los documentos de HTML son estructurados. q Los nombres de las etiquetas y los valores de los atributos no son sensibles a las maysculas u <HTML> == <html> == u <Hr noshade> == <hTml>
ENERO 2004
IUTVAL
REGLAS DE HTML
qUsando HEADER Tag Font Fijos u Desde 1 hasta 6 q<BASEFONT> - Predefinidos u<H#> header </H#>
ENERO 2004
ESTILOS DE PRESENTACIN IUTVALdel Texto Tamao
<hr NoShade>
uEl Font por defecto en la pgina web uDesde 1 hasta 7
q Los valores de los atributos pueden ser sensibles a maysculas.
ING. MAYBEL GILsrc =FILE.GIF> u <IMG src=file.gif> <> <img
qFonts Relativos u o <BIG> qFonts Variables
ING. MAYBEL oGIL u 

u ... 
q Los nombres de las etiquetas no pueden contener espacios. u no significa <img>
ENERO 2004
IUTVAL
REGLAS DE HTML
<HTML> <HEAD>
<TITLE>Ejemplo 2 - Cabeceras</TITLE> </HEAD> <BODY>
ENERO 2004
IUTVAL Cabeceras.htm
q Los valores de los atributos pueden contener espacios si el valor est encerrado entre comillas. u <Img src=perro.gif alt=Ruso> u <Img src=perro.gif alt=Mi perro Ruso>
<H1 ALIGN=left>Texto muy grand e H1 </H1> <H2 ALIGN=center>Texto grande H2 </H2> <H3 align=rigth>Texto normal H3 <H4>Texto pequeño H4
</H3> </H4> </H6>
ING. MAYBEL GIL q Los documentos de HTML pueden contener comentarios

<!Nombre del documento: Mi docuemnto.htm -- >
u <TD align=LEFT>
<H5>Texto muy pequeño H5
<H6>Texto realmente pequeño H6 </BODY> </HTML>
ING. MAYBEL GIL
</H5> 
IUTVAL Seccin: 02-a
<HTML> <HEAD>
<TITLE>Ejemplo 3 BaseFont y Relativos </TITLE> <BASEFONT SIZE=4> </HEAD> <BODY>
ENERO 2004
IUTVAL
Basefont.htm
ATRIBUTOS DEL TAG FONT

q SIZE: Tamao de fuente q FACE: Tipo de fuente qEjemplo: ... q COLOR : Color de fuente qTITLE : Ayuda flotante.
ENERO 2004
IUTVAL
Mi texto con tamaño 6 mi texto con tamaño 4, 2. </BODY> </HTML>
y Mi texto con tamaño
ING. MAYBEL GIL
ING. MAYBEL GIL
<HTML> <HEAD>
<TITLE>Ejemplo 4 Fonts Variables</TITLE> </HEAD> <BODY>
Texto tamaño 7 Texto tamaño 6 Texto tamaño 5 Texto tamaño 4 Texto tamaño 3 Texto tamaño 2 
ENERO 2004
IUTVAL
FontVariable.htm
<HTML> <HEAD>
<TITLE>Ejemplo 5 Atributos Font</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY> Este es un
ENERO 2004
IUTVAL FontColor.htm
texto de color azul y este es de color negro. SIZE=4>sto es una SIZE=4>rueba </BODY></HTML> EP

</HTML>
Texto tamaño 1
ING. MAYBEL GIL
IUTVAL Seccin: 02-a
<HTML>
<HEAD>
<TITLE>Ejemplo 6 Atributo Face</TITLE>
ENERO 2004 </HEAD>

<BASEFONT SIZE=2> <BODY>
IUTVAL
Face.htm
q: Separacin de Prrafos
DICIEMBRE
IUTVAL TEXTO FORMATO DE
uAtributos: ALIGN = { center | left | right}, TITLE q... o ...: Negrita q... o <VAR>...</VAR> o : Itlica q...: Superndice q...: Subndice q:... : Subrayado q : Inserta un retorno de carro.
Texto con fuente de letra Verdana o Arial. la Arial. En caso de no encontrar la fuente Impact, utilizará En caso de no encontrar ninguna, mostrará el texto con la fuente por defecto. </BODY> </HTML>
2003ENERO 2004
ING. MAYBEL GIL
ING. MAYBEL GIL
<HTML>
<HEAD>
ENERO 2004 <BASEFONT SIZE=2>

</HEAD> <BODY>
IUTVAL
Title.htm
<TITLE>Ejemplo 7 Atributo Title</TITLE>
q<Center> : Centra texto o imgenes.
q<Samp>...</samp>: Insertar texto con una fuente diferente q<STRIKE>...</STRIKE> o <S>...</S>: Tachado q... : Efecto especial q<TT>...<TT>: Texto formateado como una mquina de escribir. q<BLINK>...</blink> : Parpadear (Netscape) q<DIV> : Define bloques o secciones con las mismas caractersticas. 5
ENERO 2004
FORMATO DE IUTVAL TEXTO
Texto de muestra. de dos lneas">Texto de muestra. </HTML>
ING. MAYBEL GIL
ING. MAYBEL GIL
<TITLE>Ejemplo 9</TITLE>
IUTVAL Seccin: 02-a
<HTML> <HEAD>
<TITLE>Ejemplo 8 Atributos Font</TITLE>
ENERO 2004 </HEAD>

<BASEFONT SIZE=2> <BODY> Texto subrayado. Texto en cursiva. <S>Texto tachado.</S> 
IUTVAL
AtributosFont.htm
<Html>
<Head> </head> <body> <pre> Esto es T E
<title> Ejemplo10 - PRE </title>
ENERO 2004
IUTVAL
Pre.htm

X T
<STRIKE>Y otro texto tachado.</STRIKE> Texto de muestra en negrita. </body> </html>
ING. MAYBEL GIL
PREFORMATEADO 
Los espacios estan bien ! Al igual que los
ING. MAYBEL GIL

RETORNOS! <!- -Sigue prxima lmina -- >
<HTML> <HEAD>
<TITLE>Ejemplo 9 Blockquote</TITLE>
ENERO 2004 </HEAD>

<BASEFONT SIZE=2 face=roman> <BODY>
IUTVAL
Blockquote.htm
</PRE> Esto es T E X T O
ENERO 2004
IUTVAL
Pre.htm
<H1 ALIGN=Center> Manual de HTML</h1> Este manual constituye una introduccion basica al lenguaje HTML, que le permitira.... <blockquote> La primera parte del curso constituye un tutorial de HTML. Ademas de los ejemplos...</blockquote>
NO PREFORMATEADO Los ESPACIOS Y RETORNOS 
ING. MAYBEL GIL </body>

</html>
 Aunque hemos prestado atencion a la version....
</body> <HTML>
ING. MAYBEL GIL

6
se pierden !!!.
IUTVAL Seccin: 02-a
CARACTERES ESPECIALES
q Acentos: & {carcter a acentuar} acute; é para la ñ para la í para la ó para la ú para la Á para la É para la Í para la Ó para la Ú para la Ñ para la ü para la Ü para la ¿ para ¡ para
ENERO 2004
IUTVAL
# XXYYZZ
XX = Cantidad ENERO 2004de Rojo ZZ = Cantidad de Azul
ATRIBUTO IUTVALCOLOR
YY = Cantidad de Verde
Cdigo Hexadecimal
ING. MAYBEL GIL
ING. MAYBEL GIL #FFFFFF Rojo: #FF0000 Blanco

Verde # 00FF00 Azul # 0000FF Negro # 000000 Amarillo #FFFF00
0..9 ABCDEF 00 Menor FF Mayor
CARACTERES ESPECIALES
q Cdigo ASCII: &#Codigo ENERO 2004 ASCII; Nmeros del 0 al 9 Caracteres de la A a la Z Caracteres de la a a la z 0 a 9 A a Z a a z q 
IUTVAL
BLOQUES SEPARADORES
CLEAR ={left,right, all,none} q q<HR> SIZE WIDTH
ENERO 2004
IUTVAL
ING. MAYBEL GIL
ING. MAYBEL GIL NOSHADE ={TRUE,FALSE}

COLOR
ALIGN = {LEFT,RIGHT, CENTER}
IUTVAL Seccin: 02-a
<html> <body>
<head><title> Ejemplo 11- HR</title></head> HR con tamao 10 <hr size=10> HR con ancho del 50% y sin sombra sombra Ancho de 200 pixeles, tamao de 3 pixeles y sin Ancho de 100, alineado a la derecha Ancho de 100 alineado al centro </body> </html>
ENERO 2004
IUTVAL
Hr.htm
<HTML>
<HEAD><TITLE>Ejm 12 - BGPROPERTIES BODY</TITLE> <BASEFONT SIZE=2></HEAD> BGPROPERTIES=FIXED> <BODY BACKGROUND="Img\rojo.jpg"
ENERO 2004
IUTVAL
BgProperties.htm
Página web con una imagen fija de fondo. Se trata de visualizar la página moviéndonos por ella mediante scroll para ver este efecto. </BODY></HTML>
ING. MAYBEL GIL
ING. MAYBEL GIL
<!terminar el ejercicio usando el tag HR -- >
TAG <BODY> IUTVAL q BGCOLOR

Use un nombre de color ( 16) O use un valor hexadecimal RBG q BACKGROUND : Imagen (.jpg o .gif) q TEXT: color del texto de la pgina q LINK, VLINK, ALINK: color de los vnculos. q LEFTMARGIN, TOPMARGIN, BOTTOMMARGIN (IE) q BGPROPERTIES = {fixed} combinado con background (IE)
ENERO 2004
LISTAS IUTVAL</DL> q Listas de Definicin <DL>

Trmino <DT> Definicin <DD>
ENERO 2004
qListas Ordenada <OL> </OL> Item <LI> TYPE = 1,A,a,I,i START = ValorLista qListas Desordenadas <UL> </UL> TYPE = circle, disc, square
ING. MAYBEL GIL
ING. MAYBEL GIL
COMPACT {browser-no soporta}
IUTVAL Seccin: 02-a
<html>
<head><title>Ejem 13 -Listas Def</title></head> <body> <dl> <h1 align="center">Definiciones </h1> <dt>Internet</dt> redes...</dd> <dd>Nombre dado a la amplia red mundial de
ENERO 2004
IUTVAL
ListasDef.htm
<html> <body> <ol>
<head><title>Ejm 15-Ordenadas</title></head> Las listas ordenadas pueden ser muy sencillas <li> elemento 1 <li> Elemento 2 </ol> <ol> Las listas ordenadas pueden ser de varios tipos <li type="a"> Letras minsculas
ENERO 2004
IUTVALO
ListasOrd.htm
<dt>Dominio</dt>
<dd>Parte fija de la direccin utilizada para
representar una red o husped en Internet</dd> </dt> <dl>
ING. MAYBEL GIL
<li type="i"> Nmeros romanos en minscula <li type="1"> Nmeros arbigos </ol> <!- -Sigue prxima lmina -- >
ING. MAYBEL GIL
</body></html>
<HTML>
<HEAD><TITLE>Ejm 14 - Listas Desordenadas</TITLE> <BASEFONT SIZE=2></HEAD> <BODY TEXT=#000000>
ENERO 2004 

Lista desordenada: <UL TYPE=circle> <LI>Con círculo </UL> <UL TYPE=square> </UL>
IUTVAL
ListasDesord.htm
<! - - Continuacin lmina - - > 
 Las listas pueden comenzar en diferentes valores <ol start="10" type="a" compact> <li> esto debera ser j <ol>
ENERO 2004
IUTVAL
ListasOrd.htm
<li> Las listas se pueden anidar <ol> <li>hasta una profundidad cualquiera
<LI>Cuadrado relleno <UL TYPE=disc>
</ol> </ol> </ol>
ING. MAYBEL GIL
<LI>Círculo relleno (por defecto)</UL> </BODY></HTML>
</body> </html>
ING. MAYBEL GIL

9
IUTVAL Seccin: 02-a
q SRCENERO 2004 .png | tiff} = { File: .jpg| .gif | q ALIGN {left, right, top, middle, bottom} q BORDER = # q HSPACE, VSPACE q WIDTH, HEIGHT
TAG <IMG> IUTVAL
<HTML> <HEAD>
<TITLE>Ejm 17 - Align</TITLE> <BASEFONT SIZE=2> </HEAD>
ENERO 2004
IUTVAL
ImgAlign.htm
<BODY BGCOLOR=#000000 BOTTOMMARGIN="80" <IMG SRC="Img\morado.jpg" align=right> COLOR=#FFFFFF SIZE=+1 FACE="Verdana, Arial">Hay que cuidar el lugar en el que vivimos, el cuál nos proporciona todo lo que necesitamos. </BODY> </HTML>
q LOWSRC q ING. Ayuda FlotanteGIL ALT = MAYBEL
ING. MAYBEL GIL
<HTML>
<HEAD>
<TITLE> Ejm 16 - Vspace y Hspace Imagen </TITLE> <BASEFONT SIZE=2></HEAD> <BODY> <CENTER>
ENERO 2004
IUTVAL
VSpaceHSpace.htm
q <marquee> ... </marquee> (IE)
TEXTO EN MOVIMIENTO
Behavior = { scroll | alternate | slide} Bgcolor {color} ScrollAmount : Nmero de pixeles que ScrollDelay
milisegundos
ENERO 2004
IUTVAL
Texto a un lado, VSPACE=15> </CENTER> <IMG SRC="Img\morado.jpg" ALIGN=MIDDLE HSPACE=140 y texto al otro lado. </BODY></HTML>
recorrer el texto en su desplazamiento
: Retardo medido en Height {px}
ING. MAYBEL GIL
Width
{px}
ING.= MAYBEL GIL Loop {infinite (default), -1, entero}

align = { bottom | left | right | top} direction = { down | left | right | up} 10
Direction = {left(default), right}
IUTVAL Seccin: 02-a
<HTML>
<HEAD><TITLE>Ejm 18 -Behavior MARQUEE</TITLE> <BASEFONT SIZE=2></HEAD> <BODY TEXT=#0000ff>
ENERO 2004 

<MARQUEE BEHAVIOR=scroll> </MARQUEE> Texto deslizante de ejemplo - scroll - ... <MARQUEE BEHAVIOR=alternate> Texto deslizante de ejemplo - alternate - ... </MARQUEE> <MARQUEE BEHAVIOR=slide>
IUTVAL
MarqueeBehavior.htm
<TABLE>
<CAPTION>Ttulo Tabla </CAPTION> <TR> <TH>Header Celda 1 </TH> <TH>Header Celda 2 </TH> </TR> <TR>
ENERO 2004
TABLAS IUTVAL
Texto deslizante de ejemplo - slide - ...
ING. MAYBEL GIL
</MARQUEE> </BODY></HTML>
</TR> </TABLE>
ING. MAYBEL GIL
<TD>Data Celda 1 </TD> <TD>Data Celda 2 </TD>
<HTML> <HEAD>
<TITLE>Ejm 19 - Marquee</TITLE> <BASEFONT SIZE=2> </HEAD>
IUTVAL
Marquee.htm
TABLAS IUTVAL q <TABLE>
<BODY TEXT=#000000>
ENERO 2004
Bordercolor, border, bordercolorlight, bordercolordark, align, cellspacing, cellpadding, width, height, valign (top, bottom, center}
ENERO 2004

<MARQUEE BEHAVIOR=alternate BGCOLOR=yellow DIRECTION=up LOOP=6 SCROLLAMOUNT=1 SCROLLDELAY=40> Texto deslizante de ejemplo - alternate - ... </MARQUEE> </BODY></HTML>
q <CAPTION> - No muy usado Align {top|bottom} q <TR> Bordercolor, bgcolor, align, height,
ING. MAYBEL GIL
ING. MAYBEL GIL

valign nowrap, rowspan, colspan
q <TH>, <TD> Background, align, width, height, valign, 11
IUTVAL Seccin: 02-a
<HTML> Tabla.htm <HEAD> <TITLE>Atributo color de fondo</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY> <CENTER> Ejemplo básico de una tabla aprovechando las características de color y formato de fondo y texto. <TABLE BORDER BORDERCOLOR=Black WIDTH=400> <CAPTION>Ganadores del concurso</CAPTION> <TH BGCOLOR=Silver>Nombre</TH> <TH BGCOLOR=Silver>Apellido</TH> <TH BGCOLOR=Silver>Premio</TH>
ENERO 2004
IUTVAL
ING. MAYBEL GIL
<HTML> Cellpading.htm <HEAD> <TITLE><Espacio Cellpadding</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY> <CENTER> Ejemplo básico de una tabla con espacios en blanco entre celdas. <TABLE BORDER CELLPADDING=12> <CAPTION>Ganadores del concurso</CAPTION> <TH>Nombre</TH> <TH>Apellido</TH> <TH>Premio</TH>
ENERO 2004
IUTVAL
ING. MAYBEL GIL
<TR> <TD>Antonio</TD> <TD>López</TD> <TD BGCOLOR=#FFFFDD>1 coche</TD> </TR> <TR> <TD>María</TD> <TD>Jiménez</TD> <TD BGCOLOR=#FFFFDD>1 viaje</TD> </TR> </TABLE> </CENTER></BODY></HTML>
ENERO 2004
IUTVAL
ING. MAYBEL GIL
<TR> <TD>Antonio</TD> <TD>López</TD> <TD>1 coche</TD> </TR> <TR> <TD>María</TD> <TD>Jiménez</TD> <TD>1 viaje</TD> </TR> </TABLE> </CENTER> </BODY> </HTML>
ENERO 2004
IUTVAL
<! - -Realizar el mismo ejercicio colocando el atributo CELLSPACING -- >
ING. MAYBEL GIL
12
IUTVAL Seccin: 02-a
ENERO 2004 Head1

A E B F C G
COLSPAN IUTVAL
Head2
B 1 2 A ENERO 2004 C D 4 5 H Item 1 6 Item 2 Item 4
IUTVAL3
TABLAS ANIDADAS
Head 3 Head 4 Head 5 Head 6 D
ING. MAYBEL GIL
ING. MAYBEL GIL

Item A Item B
ENERO 2004
A 1 3 C D
IUTVAL
ROWSPAN
2 4
Texto ROJO
ENERO 2004
IUTVAL FONDO DE COLORES

Texto VERDE
Texto AZUL
Texto AMARILLO
ING. MAYBEL GIL
ING. MAYBEL GIL

13
IUTVAL Seccin: 02-a
q Tag <A> Anchor
HREF : direccin Target: Abrir otra pgina Self : misma pgina _blank : nueva pgina _top : _blank (sin frames) Title ING. MAYBEL GIL _parent = _self (parent frame)
ENERO 2004
IUTVAL
ENLACES
<HTML> TiposEnlace.htm <HEAD> <TITLE>Varios enlaces </TITLE> </HEAD> <BODY TEXT=#000000 LINK=Blue> <h1> Diferentes tipos de URLs</h1> Enlace con <A HREF="http://www.microsoft.com/"><IMG SRC="Images\001.gif"> Microsoft</A>. <!pedir login y password (FTP) --> Enlace al servidor FTP de <A HREF="ftp://ftp.mozilla.org/pub/mozilla/">Mozilla</a> 
ENERO 2004
IUTVAL
ING. MAYBEL GIL
q Tag <A> Anchor Pginas distintas
ENERO 2004 <A HREF=protocol:direccion>

Texto del enlace </A>
protocol: http, ftp, news, telnet, mailto .
IUTVAL
ENLACES
Misma pgina <A HREF=#Direc>Enlace </A>
ING. MAYBEL GIL

Nombre </a>
<A NAME=Direc>Pulse ... </A>
Correo Electrnico <a href mailto: direccion@correo >
Enlace a <A HREF="file:///C:">la unidad C de su ordenador</a> Enlace a <A HREF="mailto:webmaster @bienvenidos.es>mailto::webmaster @bienvenidos.es </a> Enlace a las <A HREF="news://msnews.microsoft.com>News de Microsoft </a> Conéctate al buzón de correo con la consola o Telnet: <A HREF="telnet://pop.jazzfree.com:110">Consola de correo</A> </BODY></HTML>
IUTVAL
ENERO 2004
ING. MAYBEL GIL
14
IUTVAL Seccin: 02-a
AtributoBodyLink.htm <HTML> <HEAD> <TITLE>Atributo Link Body e Imagen link</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY TEXT=#000000 LINK=Blue> <CENTER> Enlace con <A HREF="http://www.microsoft.com/"><IMG SRC="Images\001.gif"> Microsoft</A>. </CENTER> </BODY> </HTML>
ENERO 2004
IUTVAL
ING. MAYBEL GIL
<HTML> EnlacePag.htm <HEAD> <TITLE>Enlace misma pagina</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY TEXT=#000000 LINK=Blue> TUTORIAL <A NAME="Indice"></A> <A HREF="#Intro">Introducción</A> <A HREF="#Cap1">Capítulo 1</A> 
ENERO 2004
IUTVAL
ING. MAYBEL GIL
<!sigue en la otra lamina -- >
ENLACES MISMA PGINA

q <a name=Direc>: indica el lugar de la pgina en el cual se realizar el enlace.
ENERO 2004
IUTVAL
q <a ref = #Direc>: se le asigna el nombre identificado en la etiqueta Name. <a name= miEnlace> Enlazar </a> <a ref=#miEnlace>Salta </a>
ING. MAYBEL GIL
<HR> <A NAME="Intro">Introducción</A> Este es el texto de la introducción. Aquí ponemos la introducción del tutorial. Nota: Para poder visualizar adecuadamente este ejemplo, reduzca la ventana a una tamao suficiente para comprobar el funcionamiento de los enlaces dentro de una misma página. <A HREF="#Indice">Volver al índice</A> 
ENERO 2004-01-12
IUTVAL
ING. <!sigue en la otra lamina -- > MAYBEL GIL

15
IUTVAL Seccin: 02-a
<A NAME="Cap1">Capítulo 1</A> Este es el texto del capítulo 1. Aquí, representamos el capítulo 1 entero. Sus imágenes, textos, explicaciones, código, ejemplos, etc. <A HREF="#Indice">Volver al índice</A> </BODY> </HTML>
ENERO 2004
IUTVAL
q <sound> Sonido corto
SCR : wav Loop {infinite}, Delay SCR: {wav,midi,au} Balance : +-100000
ENERO 2004
IUTVAL
MULTIMEDIA
( Mosaic)
q <BgSound> : Sonido de fondo.
(IE)
ING. MAYBEL GIL
ING. MAYBEL GIL0 Volumen: -10000 y

MULTIMEDIA IUTVAL
Loop : -1 a Loop (omite sonido una sla vez)
<html><head><title>Escuelas </title></head> <body> <blockquote> MenuEnlace.htm Contenido: <a href="#Historia">Historia y Objetivos de las Escuelas.</a> <a href="#Comite">Comite Organizador.</a> <a href="#Nacional">Comite Nacional de la Escuela.</a> <a href="#Publicaciones">Publicaciones de las Escuelas.</a><a> </a><a href="#Extensiones">Extension de los cursos de la Escuela.</a> <a href="/db/pdf_ula/edocs/htm/eventos/matematicas/dc_IIIEscuela. htm">Tercera Escuela Venezolana para la Enseanza de la Matemtica.</a> <a href="#Contactos">Contacto con la Escuela.</a> </blockquote></body></html>
ENERO 2004
IUTVAL
q <embed> Sonido Loop {true}
ENERO 2004 SCR : midi, wav
( Netscape)
Hidden = {true} = Consola invisible Width, Height : Anchura de la consola Height Autostart: Arranca automticamente
ING. MAYBEL GIL
ING. MAYBEL GIL
16
IUTVAL Seccin: 02-a
<HTML>
<HEAD> <TITLE>Formato WAV</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY>
ENERO 2004
IUTVAL
MultimiediaWav.htm
<HTML>
<HEAD> <TITLE>MIDI_BAMBA</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY>
ENERO 2004
MultimiediaMidi2.htm IUTVAL
<IMG SRC="Images/001.gif"> En esta página suena un sonido corto en formato Wav. <BGSOUND SRC="Wav/Sonido.wav">
<IMG SRC="Images/001.gif"> En esta página suena un sonido continuado en formato Midi. </TABLE> <BGSOUND SRC="Midi/LaBamba.mid" LOOP=-1> </BODY></HTML>
ING. MAYBEL GIL </TABLE>

</BODY></HTML> <HTML> <HEAD>
ING. MAYBEL GIL
<TITLE>Formato MIDI</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY>
ENERO 2004
MultimiediaMidi.htm IUTVAL
<HTML>
<HEAD> <TITLE>Sonido por el Usuario</TITLE> <BASEFONT SIZE=2 face=Tahoma> </HEAD> <BODY> <h1> A Bailar..!</h1> <center><a href= midi/LaBamba.mid>
ENERO 2004
MultimiediaMidi3.htm IUTVAL
<IMG SRC="Images/001.gif"> En esta página suena un sonido corto en formato Midi. <BGSOUND SRC="Midi/Sonido.mid"> </BODY></HTML>
ING. MAYBEL GIL
<IMG SRC="Images/CDRom.gif" border=0></A> </center> </BODY>
ING. MAYBEL GIL
</HTML> 17
IUTVAL Seccin: 02-a
BIBLIOGRAFA
Powell, Thomas A. 1998. Manual de Referencia HTML. Editorial McGraw Hill. Espaa. 1066 pp. Serrano P., Jorge. 2000. Programacin con ASP. Editorial ANAYA Multimedia. Madrid Espaa. 622 pp. Enciclopedia Diseo Grfico y Programacin para Internet y Multimedia. Codesis. TomoII. Bogot, Colombia. http://archive.ncsa.uiuc.edu/general/internet/WWW/HTMLPrimerPrintable.html. http://www.webestilo.com/html/cap4a.phtml http://www.tejedoresdelweb.com/basico/definiciones/default.f.html http://www.appdev.com (Active Server Pages (ASP) Professional Skills Development Level 1). http://www.wmaestro.com/webmaestro/index.html http://www.maestrosdelweb.org/ http://www.cwru.edu/help/interHTML/ch4.html http://www.sestud.uv.es7manual.es http://html.about.com/compute/html/msubforms.htm?iam=mt http://WWW.tripod.lycos.es/webmaster/topics/technic/html/html - workshop8/0/ http://serstud.uv.es/manual.es/manual.zip
18

Curso Basico HTML

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Curso Basico HTML

Cargado por

Copyright:

Formatos disponibles

Repblica Bolivariana de Venezuela Ministerio de Educacin Superior Instituto Universitario de Tecnologa Valencia Departamento de Informtica

HTML (HyperText Markup Language)

ING. MAYBEL GIL u<center> ...</center>

u<IMG> u<P> Etiqueta vaca [</p>]

GUIA TERICA LENGUAJES COMERCIALES HTML

: DELY M. GIL A. VALENCIA, 2004

ING. MAYBEL GIL

IUTVAL Seccin: 02-a

Lenguajes Comerciales Prof . Maybel Gil

ESTRUCTURA DE UNA PGINA WEB HTML

<title> Primer ejemplo de HTML </title>

<!Meta Etiquetas -- > </HEAD> <!Fin Cabecera -- >

ING. MAYBEL GIL > < -- Cuerpo de la Pgina Web--

ING. MAYBEL GIL

TAGS DE LA ESTRUCTURA WEB

ENERO 2004 q<HEAD> ... </HEAD

<TAG Atributo1=valor Atributo2 = valor ...></TAG> Ejemplo:

ING. MAYBEL GIL

uTambin contiene los tags <BASE>, <ISINDEX>,

<font face=Arial,Tahoma color=yellow size=6>... </font>

q<!- Comentario --> u No se despliega en el Browser pero si en el cdigo

ING. MAYBEL GIL

IUTVAL Seccin: 02-a

Lenguajes Comerciales Prof . Maybel Gil

ESTILOS DE PRESENTACIN IUTVALdel Texto Tamao

uEl Font por defecto en la pgina web uDesde 1 hasta 7

q Los valores de los atributos pueden ser sensibles a maysculas.

ING. MAYBEL GILsrc =FILE.GIF> u <IMG src=file.gif> <> <img

qFonts Relativos u<FONT SIZE=+1> o <BIG> qFonts Variables

ING. MAYBEL oGIL u<FONT SIZE=-1> <SMALL>

<TITLE>Ejemplo 2 - Cabeceras</TITLE> </HEAD> <BODY>

</H3><BR> </H4><BR> </H6>

ING. MAYBEL GIL q Los documentos de HTML pueden contener comentarios

<H5>Texto muy peque&ntilde;o H5

<H6>Texto realmente peque&ntilde;o H6 </BODY> </HTML>

ING. MAYBEL GIL

IUTVAL Seccin: 02-a

Lenguajes Comerciales Prof . Maybel Gil

<TITLE>Ejemplo 3 BaseFont y Relativos </TITLE> <BASEFONT SIZE=4> </HEAD> <BODY>

ATRIBUTOS DEL TAG FONT

<FONT SIZE=-2>y Mi texto con tama&ntilde;o

ING. MAYBEL GIL

ING. MAYBEL GIL

<TITLE>Ejemplo 4 Fonts Variables</TITLE> </HEAD> <BODY>

<TITLE>Ejemplo 5 Atributos Font</TITLE> <BASEFONT SIZE=2> </HEAD> <BODY> <FONT SIZE=-1>Este es un

ING. MAYBEL GIL </BODY>

<FONT SIZE=1>Texto tama&ntilde;o 1</FONT>

ING. MAYBEL GIL

IUTVAL Seccin: 02-a

Lenguajes Comerciales Prof . Maybel Gil

<TITLE>Ejemplo 6 Atributo Face</TITLE>

ENERO 2004 </HEAD>

q<P>: Separacin de Prrafos

IUTVAL TEXTO FORMATO DE

ING. MAYBEL GIL

ING. MAYBEL GIL

ENERO 2004 <BASEFONT SIZE=2>

<TITLE>Ejemplo 7 Atributo Title</TITLE>

q<Center> : Centra texto o imgenes.

FORMATO DE IUTVAL TEXTO

<FONT SIZE=-1 FACE="Verdana, Arial"

ING. MAYBEL GIL

ING. MAYBEL GIL

IUTVAL Seccin: 02-a

<H5>Texto muy pequeño H5

<H6>Texto realmente pequeño H6 </BODY> </HTML>

<FONT SIZE=-2>y Mi texto con tamaño

<FONT SIZE=1>Texto tamaño 1</FONT>

<LI>Círculo relleno (por defecto)</UL></FONT> </BODY></HTML>