Ejercicios HTML

1.- Agrega el siguiente nombre a la pgina WEB (Duracin 3 Minutos): ombre !e la "agina: E#ercicio 1.1 $itulo !e la "agina: "rimer E#ercicio !e %$M& '.- (tili)an!o la eti*ueta *ue aplica para los prra+os reali)a el e#ercicio con el siguiente te,to (Duracin - Minutos): ombre !e la "agina: E#ercicio 1.' $itulo !e "agina: ."or *ue /e !e especi+icar ms !e una +uente0 $e,to: Debe !e especi+icar mas !e una +uente en caso !e *ue su primera opcin no este !isponible en la computa!ora !el lector. (na !e las +uentes *ue especi+i*uen !eber ser una com1n2 como Arial para aumentar la probabili!a! !e *ue su pagina WEB la mostrara. 3.- (tili)an!o el mismo e#ercicio anterior presentarlo en una "agina WEB con los 3 atributos !e alineacin. 3omo resulta!o en la pagina aparecer el te,to 3 4eces pero con !i+erente alineacin. (Duracin - Minutos) ombre !e la "agina: E#ercicio 1.3 5esto igual al e#ercicio 1.' pero con las in!icaciones menciona!as al inicio !el e#ercicio 1.3 6.- (tili)an!o la eti*ueta !e 7alto !e l8nea !e te,to reali)ar el e#ercicio con el siguiente te,to. (Duracin - Minutos) ombre !e la "agina: E#ercicio 1.6 $8tulo: $/e 5eason $e,to: 9:m not a per+ect person $/ere:re man; t/ings 9 <is/ 9 ne4er !o But 9:m continue learning 9 ne4er meant to !o t/ese t/ings to ;ou 9 no< 9 /a4e to sa; be+ore 9 go $/at 9 #ust <ant ;ou to =no< -.- (tili)an!o el e#ercicio 1.6 reali)a lo siguiente (Duracin - Minutos): 3entra el titulo ; utili)a el tama>o mas gran!e !e te,to para encabe)a!os al igual agrega un ni4el 6 al resto !el te,to ombre !e la "agina: E#ercicio 1.$itulo 3entra!o con $e,to !e Encabe)a!o ms gran!e: $/e 5eason $e,to !e encabe)a!o i4el 6: 9:m not a per+ect person $/ere:re man; t/ings 9 <is/ 9 ne4er !o But 9:m continue learning 9 ne4er meant to !o t/ese t/ings to ;ou 9 no< 9 /a4e to sa; be+ore 9 go $/at 9 #ust <ant ;ou to =no< ?.- (tili)an!o el e#ercicio 1.- reali)a lo siguiente (Duracin 1@ Minutos): (tili)a los 3 atributos !e alineacin !e tal manera *ue el te,to aparecer tres 4eces en pgina WEB 3entra el titulo ; utili)a el tama>o mas gran!e !e te,to para encabe)a!os al igual agrega un ni4el 6 al resto !el te,to ombre !e la "agina: E#ercicio 1.? $itulo 3entra!o con $e,to !e Encabe)a!o ms gran!e: $/e 5eason $e,to !e encabe)a!o i4el 6: 9:m not a per+ect person $/ere:re man; t/ings 9 <is/ 9 ne4er !o But 9:m continue learning Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

9 ne4er meant to !o t/ese t/ings to ;ou 9 no< 9 /a4e to sa; be+ore 9 go $/at 9 #ust <ant ;ou to =no< A.- 5eali)a el siguiente e#ercicio utili)an!o la eti*ueta !e pre+ormatea!o para te,to ; utili)an!o comentarios en ca!a eti*ueta e,plican!o para *ue se utili)a ca!a una !e las eti*uetas utili)a!as. (Duracin 1- Minutos) ombre !e la "agina: E#ercicio 1.A $itulo 3entra!o con $e,to !e Encabe)a!o ms gran!e: 9n+ormacin !e Autom4iles Autom4il Marca Mo!elo "recio 3/e4; BM '@@6 CA@2@@@ Ma,ima issan '@@C1D@2@@@ 7un+ire BM '@@6 CE@2@@@ Arma!a issan '@@? C3-@2@@@ D.- 5eali)a la siguiente "agina WEB (Duracin '@ Minutos)

CINEMARK
$e in4itamos a *ue 4engas a 4er estas interesantes pel8culas ; cono)cas nuestras nue4as salas con los e*uipos !e soni!o *ue te encantarn2 con la compra !e tu boleto tambiFn ten!rs acceso a:
* Palomitas * Refresco * Hot Dog

%orarios !e "eliculas
Pelicula Superman Break Up ision !mposi"le 3 Horarios 7:00 pm 8:00 pm #:00 pm Costo del Boleto $40.00 $35.00 $40.00 $%&'(

NO FALTES
E.- 5eali)a el E#ercicio 1.E con las siguientes instrucciones. "ara el t8tulo utili)a un tama>o !e letra gran!e. "rimer "rra+o utili)a la eti*ueta !e pre+ormatea!o2 resto !el te,to normal2 1ltimo te,to utili)ar un tama>o !e letra pe*ue>o ; encontrars caracteres especiales *ue se ten!rn *ue insertar. (Duracin 1@ Minutos)

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

t"A"T"#
t.).*.u )+, -,.) /)*!.) 0 1U-!) 23-/32)

$$$"tat#girls"com $$$"i%tersco&e"com $$$"tat#"r# $$$"#%i'ersalm#sic"r#

()(!**! +%i'ersal M#sic R#ssia, A%-er E.cl#si'e lice%se to I%tersco&e Recor-s"

1@.- 5eali)a el E#ercicio 1.1@ con las siguientes instrucciones. "ara el titulo utili)a un tama>o !e letra gran!e2 letra negrita ; cFntralo a la pgina2 para el subtitulo utili)a un tama>o !e letra mas pe*ue>o *ue el titulo pero mas gra!e *ue el resto !el te,to2 con letra negrita. "ara el prra+o !e te,to utili)a un tama>o !e te,to normal. "re+ormatea la seccin !e e#emplo ; para la ultima seccin !e te,to utili)a un tama>o !e letra pe*ue>o ; caracteres especiales (Duracin 1@ Minutos)

INTRODUCCION A HTML
DOCUMENTOS HTML
Las &agi%as /E0 so% -oc#me%tos HTML" +% -oc#me%to HTML co%siste e% te.to e i%str#ccio%es es&eciales llama-os eti1#etas" Tie%e% las e.te%sio%es "2tml o "2tm"
,4emplo: inde&.5tml $!ndica 6ue !nde& es un documento con contenido H* -(

Copyright 1997 por Trejos Hermanos !"esores# $A$

11.- 5eali)a el E#ercicio 1.11 utili)an!o el mismo E#ercicio 1.1@. En los t8tulos a!ems !e &etra en egrita agrega tambiFn letra 3ursi4a (Duracin - Minutos)

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

1'. 5eali)a el E#ercicio 1.1' con las siguientes instrucciones. "ara el t8tulo utili)a un tama>o !e letra gran!e2 agregan!o cursi4a ; negrita a!ems !e centra!o. "ara el subtitulo utili)a un tama>o !e letra normal a!ems !e negrita ; cursi4a2 "ara la primer seccin !e te,to utili)a la eti*ueta !e pre+ormatea!o ; la eti*ueta !e tac/a!o para los !atos *ue as8 lo in!ican. "ara la 1ltima seccin !e te,to utili)a un tama>o !e letra pe*ue>o a!ems !e utili)ar caracteres especiales (Duracin 1- Minutos)

TELMEX
LADA AUTOMATICA NACIONAL
7ec5a ar:0' ar:08 ar:'0 Hora '5:55 '5:4# '%:'5 $-)8)(*ele9ono $8'(8888 ;0%' $8'(8888 ;087 $8'(8888 #545 Po"lacion onterre< onterre< onterre= *ipo de *ari9a P!C3 P!C3 P!C3 inutos # ' !mporte '5.48 %.58

7.74

4 Telefo%os -e Me.ico

13. 5eali)a el E#ercicio 1.13 utili)an!o el mismo E#ercicio 1.1' agregan!o subra;a!o al titulo2 subtitulo ; a los !atos !e 9mporte. (Duracin - Minutos)

TELMEX
LADA AUTOMATICA NACIONAL
Fecha Mar-0 Mar-0# Mar- 0 Hora !"!! !"+) %" ! (LADA)Telefono (# )#### $0% (# )#### $0#, (# )#### )!+! Poblacion Monterre& Monterre& MonterreTipo de Tarifa PI'( PI'( PI'( Minutos ) Importe !*+# %*!#

,*,+

% Te&e'onos (e Me)i"o

16. 5eali)a el E#ercicio 1.16 siguien!o las siguientes instrucciones. "ara el t8tulo utili)a un tama>o !e letra gran!e a!ems !e letra cursi4a ; negrita. "ara las ecuaciones utili)a el mismo tama>o !e letra *ue el titulo a!ems !e los !atos en sub8n!ice ; super8n!ice (Duracin Minutos)

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

Ecuaciones Matemticas *+,-**+,.*/ *.,0*+

1-. 5eali)a el E#ercicio 1.1- siguien!o las siguientes instrucciones. "ara el te,to utili)a un tama>o !e letra gran!e en negrita ; centra!o. "ara el primer prra+o !e te,to utili)a la eti*ueta !e $e,to $ipo Mecanogra+ia!o ; para el segun!o prra+o utili)a un tama>o !e letra normal. (Duracin - minutos)

1ti2!eta Te)to Tipo Me"anogra'ia(o

,stas eti6uetas dan un 9ormato de te&to o porcion del documento 6ue en>lo"an. ,ste tipo de eti6uetas tiene una marca inicial? < una marca 9inal i>ual 6ue la inicial? pero con el caracter @A@.

Estas etiquetas dan un formato de texto o porcion del documento que englo an! Este tipo de etiquetas tiene una marca inicial" # una marca final igual que la inicial" pero con el caracter $%$!
1?. 5eali)a el E#ercicio 1.1? siguien!o las siguientes instrucciones. "ara el t8tulo utili)a un tama>o !e letra gran!e en negrita ; cursi4a a!ems !e centra!o a!ems !e especi+icar el tipo !e letra *ue se !esea utili)ar. "ara la seccin !e te,to utili)a un tama>o !e letra normal alinean!o el te,to al centro ; especi+ican!o el tipo !e +uente *ue se !esea utili)ar. o Gl4i!es colocar una Huente a!icional por si la primer opcin no se encuentra !isponible. (Duracin 1@ Minutos)

EDITOR DE TEXTO
Un editor de texto es un programa sencillo que puede utili&ar para crear # editar documentos que contienen solo texto! No inclu#en opciones a'an&adas de edicion o formato!
1A. 5eali)a el E#ercicio 1.1A siguien!o las siguientes instrucciones. "ara el t8tulo utili)ar un tama>o !e letra gran!e con cursi4a ; negrita a!ems !e centra!o. "ara la seccin !e te,to alinea la seccin !e te,to /acia la !erec/a ; espec8+ica un tipo !e +uente a utili)ar. I en generales utili)a la eti*ueta con la *ue se selecciona el tama>o !e la +uente !e to!o el !ocumento. (Duracin 1@ Minutos) Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

Cambiar el Texto
"ue!e cambiar el tama>o !e los caracteres in!i4i!uales en su pgina Web para crear e+ectos !e te,to interesantes ............
1D. 5eali)a el E#ercicio 1.1D siguien!o las siguientes instrucciones. "ara el t8tulo utili)a un tama>o !e letra gran!e2 especi+ica el tipo !e letra a utili)ar2 subra;a!o2 negrita2 cursi4a ; centra!o. "ara la primera seccin !e te,to utili)a pre+ormatea!o a!ems !e sub8n!ices ; super8n!ices !on!e se in!ica. "ara la segun!a seccin !e te,to utili)a tipo !e te,to mecanogra+ia!o2 letra cursi4a ; la alineacin !e la seccin centra!a a!ems !e subra;a!o en las partes *ue se in!ican. "ara la tercer seccin !e te,to utili)a la eti*ueta !e tac/a!o. "ara la cuarta seccin !e te,to utili)a los caracteres especiales *ue se in!ican. En generales especi+ica el tama>o !e letra para to!o el !ocumento a!ems !el tipo !e +uente *ue aplicar para to!o el !ocumento ; los espacios en blanco correspon!ientes. (Duracin '@ Minutos)

PROGRAMAS PARA CREAR PAGINAS WEB

/ditor de Te0to /1emplo " 2otepad Documento 4*t0t Procesador de Palabras /1emplo%" 3ord Documento 4*doc

Para crear una Pagina WEB usando un editor de texto o procesador de palabras, debe de digitar el texto y luego las etiquetas HTML

Necesita un explorador de la (E) *Editorial Maran+rap,ics

1E. 5eali)a el e#ercicio 1.1E siguien!o las siguientes instrucciones. "ara el titulo especi+ica un tama>o !e letra gran!e2 negrita2 cursi4a2 subra;a!o ; centra!o. "ara la seccin !e te,to alineacin centra!a ; especi+ica un tama>o !e letra normal. (Duracin - Minutos)

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

EXPLORADORES DE LA WEB
+% e.&lora-or -e la /E0 es #% &rograma 1#e le &ermite 'er 8 e.&lorar i%formaci9% e% la ///" Microsoft I%ter%et E.&lorer es #% e.&lora-or -e la /E0 Po&#lar 1#e es &arte -e /i%-o$s" P#e-e tam:i;% o:te%erlo e% el sitio $$$"microsoft"com<ie o e% tie%-as -e com&#taci9%

'@. 5eali)a el e#ercicio 1.'@ siguien!o las siguientes instrucciones. "ara el t8tulo especi+ica un tama>o !e letra gran!e ; especi+ica el tipo !e letra a utili)ar2 a!ems !e utili)ar negrita2 centra!o2 cursi4a ; subra;a!o. "ara el subtitulo especi+ica un tama>o normal !e letra ; especi+ica un tipo !e letra a!ems !e subra;a!o ; alineacin a la i)*uier!a. "ara la seccin !e te,to especi+ica un tama>o !e letra normal ; un tipo !e letra a!ems !e letra cursi4a. En generales utili)a la eti*ueta para *ue to!o el te,to !el !ocumento este !e un olor !e+ini!o (el *ue tu !eci!as). (Duracin 1@ Minutos)

INTRODUCCION A LA WEB
-.+/N. (E)
Una pagina Web es un documen o en la WWW. Puede incluir e! o" im#genes" sonido y video.

'1. 5eali)a el e#ercicio 1.'1 siguien!o las siguientes instrucciones. "ara el t8tulo especi+ica un tama>o !e letra gran!e2 un tipo !e +uente ; un color !etermina!o a!ems !e negrita ; entra!o. "ara la seccin !e te,to especi+ica un tama>o !e letra2 un tipo !e +uente ; un color !etermina!o !i+erente al titulo a!ems e alineacin centra!a ; letra cursi4a. (Duracin 1@ Minutos)

H/-E01/NCULOS
Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

$as paginas WEB con ienen %ipervnculos" los cuales son e! o o im#genes des acados en una p#gina Web &ue se conec a a o ras p#ginas en la WWW. Puede selecionar un %ipervnculo para mos rar una P#gina WEB ubicada en la misma compu adora o en alguna par e al o ro lado de la ciudad" pas o el mundo.
''. 5eali)a el e#ercicio 1.'' siguien!o las siguientes instrucciones. "ara el titulo especi+icar un tama>o !e letra gran!e2 un tipo !e +uente ; un color !etermina!o a!ems !e centra!o2 negrita ; subra;a!o. "ara el subtitulo especi+icar un tama>o !e letra ; un color !etermina!o !i+erente al titulo. 7eparar en !os prra+os la primera ; segun!a seccin !e te,to. . "ara la palabra WEB especi+icar un tama>o !e letra ; un olor para ca!a una !e las letras2 los olores !e las 3 letras !ebe !e ser !i+erente a!ems !e negrita ; centra!o. I en generales especi+icar un color !e +on!o para to!o el !ocumento ; especi+icar un color !e te,to para to!o el !ocumento a!ems !e un tama>o !e +uente para to!o el !ocumento. (Duracin '@ Minutos)

0a&ones -ara Crear -aginas (E)

Compartir In'orma"i3n 4ersona&
M#c2as &erso%as crea% &>gi%as /E0 &ara com&artir i%formaci9% acerca -e s#s familias, mascotas, 'acacio%es o &asatiem&os fa'oritos" Otros lo 2ace% &ara &rese%tar #% c#rric#l#m a &atro%os &ote%ciales" P#e-e% crear &>gi%as /E0 &ara mostrar i%formaci9% acerca -e #%a orga%i?aci9% a cl#: al 1#e &erte%ece" Es &osi:le i%cl#ir #%a &rogramaci9% -e f#t#ros e'e%tos e i%formaci9% -etalla-a acerca -e las metas -e -ic2a orga%i?aci9%

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

16

'3. 5eali)a el e#ercicio 1.'3 utili)an!o las mismas intrusiones *ue el E#ercicio 1.'' solo *ue en el segun!o prra+o utili)ar la eti*ueta para crear un blo*ue. (Duracin - Minutos) '6. 5eali)a el e#ercicio 1.'6 siguien!o las siguientes instrucciones. "ara el titulo especi+icar un tama>o !e letra2 tipo !e +uente ; color !etermina!o a!ems !e centra!o ; negrita. "ara el resto !el !ocumento crear una lista or!ena!a especi+ican!o los caracteres especiales !on!e apli*uen. En generales agregar un color !e +on!o al !ocumento as8 como especi+icar un color para el te,to !e to!o el !ocumento ; un tama>o !e letra para to!o el !ocumento. (Duracin 1@ Minutos)

-.2 DE M.N3.N.
1" ! CArc#los e.te%-i-os -e masa :>sica &ara &a8 !" B Ta?aC1!6 g<5o?D -e a?Ecar 3" F C#c2ara-ita -e Ca%ela Moli-a
'-. 5eali)ar el e#ercicio 1.'- utili)an!o las mismas instrucciones *ue el e#ercicio 1.'6 solo *ue en los ingre!ientes comen)ar la lista or!ena!a con el 4alor 32 !an!o como resulta!o ingre!ientes 32 6 ; -. (Duracin - Minutos) '?. 5eali)ar el e#ercicio 1.'? utili)an!o las mismas instrucciones *ue el e#ercicio 1.'6 solo *ue la lista or!ena!a !e los ingre!ientes !eber iniciar con el Jalor A. "osteriormente comen)ar otra lista or!ena!a con el 4alor !e 1meros 5omanos. (Duracin - Minutos)

-.2 DE M.N3.N.
A" ! CArc#los e.te%-i-os -e masa :>sica &ara &a8 0" B Ta?aC1!6 g<5o?D -e a?Ecar C" F C#c2ara-ita -e Ca%ela Moli-a I" II" III" ! CArc#los e.te%-i-os -e masa :>sica &ara &a8 B Ta?aC1!6 g<5o?D -e a?Ecar F C#c2ara-ita -e Ca%ela Moli-a

'A. 5eali)ar el e#ercicio 1.'A utili)an!o las mismas instrucciones *ue el e#ercicio 1.'6 solo *ue en lugar !e crear una lista or!ena!a con los ingre!ientes se utilice una lista !esor!ena!a. (Duracin - Minutos) 'D. 5eali)ar el e#ercicio 1.'D con las siguientes instrucciones. "ara el titulo utili)ar un tama>o !e letra gran!e2 con negrita2 especi+ican!o un color ; un tipo !e +uente a!ems !e centra!o. "ara

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

la lista !e !e+inicin ca!a 9tem !e la lista !eber !e ir en negrita ; con un color !i+erente al !el titulo. (Duracin 1@ Minutos)

GLOSARIO
Anti7ir!s o't8are Los 'ir#s -e soft$are so% molestos :its -e c9-igo 1#e &#e-e% -eteriorar s#s arc2i'os -e &rograma" Para &roteger s# com&#ta-ora -e:er> #tili?ar #% soft$are -e a%ti'ir#s" An"ho (e 6an(a Re&rese%ta c#a%ta i%formaci9% &#e-e lle'ar #%a re-" E%tre m>s am&lio el A%c2o -e 0a%-a -e #%a re- 8 m>s r>&i-a s# 'eloci-a-, m>s i%formaci9% &o-r> almae%ar
'E. 5eali)ar el e#ercicio 1.'E con las siguientes instrucciones. "ara los t8tulos K3G $E 9DG ; B&G7A59GL utili)ar letra negrita ; especi+icar un tama>o gran!e !e letra2 un tipo !e letra ; un color !e +uente. "ara los subt8tulos K&A7 3&A793A72 "AI DE H5($A72 3%9HHG 2 E7"E39A7L especi+icar un color !e +uente ; negrita. En generales para to!o el !ocumento mane#ar un color !e +on!o2 un tama>o !e letra ; un color para la +uente !e to!o el !ocumento2 e,cepto para los t8tulos ; subt8tulos. "ara el primer prra+o !e te,to alinearlo /acia la i)*uier!a ; utili)ar letra cursi4a. "ara el segun!o prra+o utili)ar cursi4a ; consi!era *ue el segun!o prra+o esta !entro !el primero. "ara &A7 3&A793A7 utili)a una lista or!ena!a2 para "AI7 DE H5($A7 una lista !esor!ena!a ; para B&G7A59G una lista !e !e+inicin. (Duracin '@ Minutos)

CONTENIDO
LA CLA ICA 1" Pa8 -e Ma%?a%a !" Pa8 -e Cere?a 3" Pa8 Ke8 Lime

4A9 D1 :RUTA Pa8 -e Moras Pa8 -e D#ra?%o Estilo Heorgia Pa8 -e Cir#ela

GLOSARIO
Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

1*

CHI::ON Es #% ti&o -e relle%os &ara &a8s 1#e a&recia &or ser ligero 8 es&o%Ioso" 1 41CIA Los aceites esce%ciales -e las es&ecias so% s# f#e%te -e sa:or &ero se e'a&ora% co% el tiem&o"

Los pays o tartas recin hechos, sencillos y deliciosos, representan la omida asera en su mximo esplendor. Sin embargo, a pesar de su apariencia casera, hay algunos trucos para hacer pays y tartas partiendo desde cero. Por esta razn le sugiero que lea la seccin de temas bsicos al final de este libro antes de empezar a hacer las recetas. n ella encontrar todo lo que necesita saber acerca del equipo adecuado y los ingredientes a usar, as! como explicaciones detalladas acerca de las tcnicas que le proporcionarn los me"ores resultados

3@. 5eali)a el e#ercicio 1.3@ siguien!o las siguientes instrucciones. "ara el t8tulo especi+ica un tama>o !e letra ; un color !etermina!o a!ems !e centra!o. Agrega una imagen M.B9H o M.N"EB. (Duracin - Minutos)

OLD NAJK
31. 5eali)a el e#ercicio 1.31 siguien!o las mismas instrucciones *ue el e#ercicio 1.3@ pero agregan!o un bor!e a la imagen ; centran!o la imagen. (Duracin - Minutos) 3'. 5eali)a el e#ercicio 1.3' siguien!o las mismas instrucciones *ue el e#ercicio 1.31 pero agregan!o un te,to alternati4o a la imagen. "ara 4er su +uncionamiento colocar e*ui4oca!o la !ireccin !e la imagen. (Duracin - Minutos) 33. 5eali)a el e#ercicio 1.33 siguien!o las siguientes instrucciones. Agregar una imagen al !ocumento2 colocarle un bor!e alre!e!or ; agregarle te,to alternati4o. Alinear te,to con la imagen2 utili)an!o los 3 atributos !e alineacin !e te,to para imgenes !e tal manera *ue la imagen aparecer tres 4eces #unto con el te,to pero con !i+erente alineacin. "ara *ue las imgenes no salgan empalma!as !espuFs !e ca!a imagen agrega !os saltos !e l8nea. Agregar un titulo a la "gina *ue apare)ca centra!o con un tipo !e +uente2 tama>o !e letra ; color !e+ini!o $e,to a agregar: 7i /a a#usta!o te,to alre!e!or !e una imagen2 no pue!e alinearla con te,to. (Duracin 1@ minutos). 36. 5eali)a el E#ercicio 1.36 siguien!o las siguientes instrucciones. Agregar una imagen al !ocumento2 colocarle un bor!e2 agregarle te,to alternati4o ; a#ustar el te,to alre!e!or !e la Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

11

imagen utili)an!o los !os atributos !e a#uste !e te,to alre!e!or !e imagen. De tal manera *ue en la pantalla !ebern !e aparecer !os imgenes ca!a una con los atributos !e a#uste !e te,to. "ara *ue las imgenes no salgan empalma!as !espuFs !e ca!a imagen agrega los saltos !e l8nea *ue correspon!an. Agregar un titulo a la "gina *ue apare)ca centra!o con un tipo !e +uente2 tama>o !e letra ; color !e+ini!o $e,to a a#ustar alre!e!or !e la imagen: 3omo t8tulo AN(7$A5 $EO$G A&5EDEDG5 DE ( A 9MABE especi+ican!o un tipo !e +uente2 un tama>o ; un color2 "rra+o !e $e,to "ue!e a#ustar el te,to alre!e!or !e una imagen para !arle a su pagina WEB una apariencia pro+esional. 7i /a alinea!o una imagen con te,to2 no pue!e en4ol4erlo alre!e!or !e la imagen. (Duracin 1Minutos) 3-. 5eali)a el e#ercicio 1.3- siguien!o las instrucciones *ue el e#ercicio 1.36 pero agregan!o la eti*ueta !e !etener el te,to con los 3 atributos *ue le correspon!en. De tal manera *ue ten!rs *ue agregar una imagen ms para el tercer atributo !e !etener el te,to. (Duracin 1- Minutos) 3?. 5eali)a el e#ercicio 1.3? siguien!o las instrucciones !el e#ercicio 1.3- pero agregan!o espacios alre!e!or !e una imagen tanto /ori)ontalmente como 4erticalmente. (Duracin Minutos). 3A. 5eali)a el e#ercicio 1.3A siguien!o las instrucciones !el e#ercicio 1.3? pero agregan!o una imagen !e +on!o a la pgina. (Duracin - Minutos) 3D. 5eali)a el e#ercicio 1.3D siguien!o las siguientes instrucciones. $8tulo principal: 3G 7ENG7 "A5A AB5EBA5 9MPBE E72 en negrita2 subra;a!o2 centra!o2 especi+icar un tama>o !e letra ; un color. Agregar una imagen utili)an!o un bor!e2 un te,to alternati4o2 alinean!o el te,to alre!e!or !e la imagen /acia la i)*uier!a. $e,to a utili)ar: $9"G7 DE 9MPBE E7 (Especi+icar un tama>o !e letra2 un tipo !e +uente ; un color) Al agregar imgenes a sus paginas WEB2 !ebe !e utili)ar las !e tipo B9H o N"EB *ue son las mas populares en WWWW. "ue!e utili)ar un programa !e e!icin para con4ertirla a +ormato B9H o N"EB. (En 3ursi4a) Agregar otra imagen utili)an!o un bor!e2 un te,to alternati4o2 alinean!o el te,to alre!e!or !e la imagen /acia la !erec/a ; agregan!o espacios alre!e!or !e la imagen tanto /ori)ontalmente como 4erticalmente. $e,to a utili)ar: $AMAQG DE ( A 9MABE &as imgenes aumentan el tiempo *ue toma para *ue una pgina WEB apare)ca en la pantalla. 7i !ura !emasia!o2 los lectores pue!en per!er interes e irse a otra pagina. (En cursi4a ; utili)an!o te,to tipo mecanogra+ia!o) 3uan!o sea posible2 !eber utili)ar imgenes o arc/i4os pe*ue>os2 ;a *ue estas se trans+erirn ms rpi!o. (3ursi4a2 te,to tipo mecanogra+ia!o ; utili)an!o la eti*ueta *ue permite !etener el a#uste !el te,to alre!e!or !e una imagen). Agregar otra imagen utili)an!o un bor!e2 un te,to alternati4o2 alinean!o el te,to alre!e!or !e la imagen /acia la !erec/a ; agregan!o espacios alre!e!or !e la imagen tanto /ori)ontalmente como 4erticalmente. Escribir incorrecta la !ireccin !e la imagen para *ue apare)ca el te,to alternati4o. En generales colocar una imagen !e +on!o a to!a la pgina. (Duracin '@ Minutos) 3E. 5eali)a el E#ercicio 1.3E siguien!o las siguientes instrucciones. "ara el t8tulo 3(A $A7 5EB&A7 %G59RG $A&E7 "(EDG AB5EBA5 A M9 "AB9 A agregarlo centra!o2 en negrita2 en cursi4a2 subra;a!o ; especi+ican!o un tipo !e +uente2 un tama>o ; un color. "ara el conteni!o !e la pgina agregar una regla /ori)ontal ; el siguiente prra+o !e te,to en cursi4a: o utilice !emasia!as reglas /ori)ontales en su pagina WEB2 ;a *ue esto pue!e !istraer a sus lectores ; /acerla !i+8cil !e leer. "ara la 1ltima seccin !e te,to en cursi4a agregue otra regla /ori)ontal ; el siguiente te,to: $rate !e no colocar mas !e una regla en ca!a pantalla. (Duracin - Minutos) Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

1!

6@. 5eali)a el E#ercicio 1.6@ siguien!o las instrucciones !el e#ercicio 1.3E solo *ue agrega un anc/o !i+erente a ca!a una !e las reglas /ori)ontales. (Duracin - Minutos) 61. 5eali)a el E#ercicio 1.61 siguien!o las instrucciones !el e#ercicio 1.6@ solo *ue especi+ica el porcenta#e en *ue !eber !e aparecer la regla a lo anc/o !el !ocumento. "ara la regla /ori)ontal 1 especi+ica el -@S ; para la ' el A-S. (Duracin - Minutos) 6'. 5eali)a el E#ercicio 1.6' siguien!o las instrucciones !el e#ercicio 1.61 solo *ue especi+ica la alineacin !e las reglas /ori)ontales. "ara la regla /ori)ontal 1 alineacin a la !erec/a2 para la ' alineacin a la i)*uier!a ; agrega una tercer regla al +inal !el !ocumento con un anc/o !e 1porcenta#e !e 1@@S ; alineacin centra!a. (Duracin - Minutos) 63. 5eali)a el E#ercicio 1.63 siguien!o las instrucciones !el e#ercicio 1.6' solo *ue especi+ica un color para ca!a una !e las reglas /ori)ontales. (Duracin - Minutos) 66. 5eali)a el E#ercicio 1.66 siguien!o las siguientes instrucciones. "ara el titulo principal J9 3(&G7 utili)a una letra cursi4a2 en negrita2 centra!o ; especi+ican!o un tipo !e +uente un tama>o ; un color. Agrega una regla /ori)ontal especi+ican!o anc/o2 alineacin2 color ; porcenta#e para *ue apare)ca a lo anc/o !e la pgina. "ara los 48nculos 4amos a traba#ar con ' 48nculos. El primero /acien!o un 48nculo con un E#ercicio ;a reali)a!o en este aso el E#ercicio 3E ; el segun!o a la "agina principal !e %otmail.

VINCULOS
Ir a EIercicio 3G Ir a Pagi%a Pri%ci&al Hotmail
6-. 5eali)a el E#ercicio 1.6- siguien!o las instrucciones !el 1.66 pero a!ems agrega una imagen ; /a) un 48nculo !e esta para *ue al seleccionarla nos lle4e a la "agina !el e#ercicio 3E ; agrega otra imagen ; /a) un 4inculo !e esta para *ue al seleccionarla nos lle4e a la "agina principal !e %otmail. (Duracin 1@ Minutos) 6?. 5eali)a el E#ercicio 1.6? siguien!o las siguientes instrucciones. "ara el t8tulo principal J9 3(&G7 DE $5G DE ( A "AB9 A utili)ar negrita ; centra!o. 5eali)ar un 4inculo !entro !e una misma pagina WEB llaman!o a los 48nculos "aso 1 "onerle nombre al rea !e la pagina WEB ; "aso ' 3rear el Jinculo con un rea !e la pagina WEB. Agregar una imagen ; el te,to *ue se in!ica posteriormente otra imagen ; la ultima seccin !e te,to. Jeri+ica *ue los 48nculos +unciones al seleccionar "aso 1 el 48nculo te !ebe !e lle4ar automticamente a la seccin !e te,to "aso 1 ; si seleccionas "aso ' el 48nculo te !ebe !e lle4ar a la seccin !e te,to "aso '. (Duracin 1- Minutos)

;INCULO D1NTRO D1 UNA 4A<INA Paso 1 Po%erle %om:re al >rea -e la &agi%a /E0 Paso ! Crear el Ji%c#lo co% #% >rea -e la &agi%a /E0 IMAHEN

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

13

Paso 1 Po%erle %om:re al >rea -e la &agi%a /E0 De:e -e &o%erle %om:re al >rea -e la &>gi%a /E0 1#e -esea 1#e los lectores 'ea% r>&i-ame%te" IMAHEN

Paso ! Crear el 'i%c#lo co% #% area -e la &agi%a /E0 De:e crear #% 'A%c#lo 1#e los lectores &#e-a% seleccio%ar &ara mostrar el >rea -e la &>gi%a /E0
6A. 5eali)a el E#ercicio 1.6A siguien!o las instrucciones !el e#ercicio 1.6? solo *ue con la primer imagen crear un 48nculo *ue te lle4e a la misma imagen ; agrega un te,to *ue te in!i*ue *ue al seleccionar la imagen te lle4ar a la misma amplia!a. (Duracin - Minutos). 6D. 5eali)a el E#ercicio 1.6D siguien!o las instrucciones !el e#ercicio 1.6A pero a!ems agregar al +inal !el !ocumento un 48nculo con tu !ireccin !e correo electrnico con el te,to En4iar correo electrnico para ms in+ormacin. (Duracin - Minutos) 6E. 5eali)a el E#ercicio 1.6E siguien!o las instrucciones !el e#ercicio 1.6D pero a!ems agregar colores a los lin=s 4isita!os ; no 4isita!os. (Duracin - Minutos) -@. 5eali)a el E#ercicio 1.-@ siguien!o las siguientes instrucciones. "ara el t8tulo cFntralo ; utili)a negrita con un tama>o !e letra normal. 9nserta una tabla como la *ue se muestra a continuacin: (Duracin 1@ Minutos)

1=UI4O D1 :UT6OL 12!ipos >!ga(ores <o&es America Memo Oc2oa * 0arcelo%a Rafael Mar1#e? 3 Port#gal Figo 5
-1. 5eali)a el E#ercicio 1.-1 siguien!o las instrucciones !el e#ercicio 1.-@ pero agregan!o un bor!e a la tabla. (Duracin - Minutos) -'. 5eali)a el E#ercicio 1.-' siguien!o las instrucciones !el e#ercicio 1.-1 pero agregan!o la eti*ueta !e le;en!a para tablas en tama>o 62 centra!a2 negrita ; cursi4a colocan!o como le;en!a 9n+ormacin !e E*uipos. (Duracin - Minutos). -3. 5eali)a el E#ercicio 1.-3 siguien!o las instrucciones !el e#ercicio 1.-' pero combinan!o las cel!as a tra4Fs !e columnas como se muestra a continuacin. (Duracin - Minutos)

1=UI4O D1 :UT6OL In ormacion !e los E"ui#os 12!ipos (e :!t?o& 12!ipos >!ga(ores <o&es 15

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

I%formacio% America Port#gal Memo Oc2oa Figo * 5 0arcelo%a Rafael Mar1#e? 3

-6. 5eali)a el E#ercicio 1.-6 siguien!o las instrucciones !el e#ercicio 1.-' pero combinan!o las cel!as a tra4Fs !e +ilas como se muestra a continuacin. (Duracin - Minutos)

1=UI4O D1 :UT6OL In ormacion !e los E"ui#os 12!ipos 12!ipos (e :!t?o& America Port#gal >!ga(ores Memo Oc2oa Figo <o&es * 5

0arcelo%a Rafael Mar1#e? 3

--. 5eali)a el E#ercicio 1.-- siguien!o las instrucciones !el e#ercicio 1.-6 pero agregan!o alineacin !e !atos /ori)ontalmente ; 4erticalmente. "rimer Hila Alineacin 3entra!a ; arriba2 segun!a +ila alineacin a la !erec/a ; al centro2 tercera +ila alineacin a la i)*uier!a ; aba#o ; cuarta +ila !e#ar los 4alores !e+ault. (Duracin 1@ Minutos). -?. 5eali)a el E#ercicio 1.-? siguien!o las siguientes instrucciones. (tili)a las eti*uetas necesarias para con+igurar un +ormulario ; crea !os cua!ros !e te,to. "rimer cua!ro !e te,to para K ombre !el AlumnoL con un anc/o !e -@ caracteres ; como numero m,imo !e caracteres a intro!ucir !e 6-. 7egun!o 3ua!ro !e te,to para KDireccinL con las mismas caracter8sticas !el primero. $8tulo !e la pgina en negrita ; cursi4a K9n+ormacin !el AlumnoL. (Duracin 1@ Minutos) -A. 5eali)a el e#ercicio 1.-A siguien!o las instrucciones !el E#ercicio 1.-? pero a!ems incorpora un rea !e te,to gran!e para K3omentarios ; 7ugerenciasL !on!e los comentarios *ue intro!u)ca el lector se a#usten automticamente. (Duracin - Minutos) -D. 5eali)a el e#ercicio 1.-D siguien!o las instrucciones !el E#ercicio 1.-A pero a!ems incorpora cua!ros !e 4eri+icacin antes !el rea !e te,to !e comentarios. &os cua!ros !e 4eri+icacin son para KMatemticasL ; KH8sicaL. Antes agrega el te,to K3ual es tu materia +a4orita:L (Duracin Minutos) -E. 5eali)a el e#ercicio 1.-E siguien!o las instrucciones !el E#ercicio 1.-D pero a!ems incorpora botones !e opcin antes !el rea !e te,to !e comentarios. &os botones !e opcin son para KTuintoL ; K7e,toL. Antes agrega el te,to KEn *ue semestre estas:L (Duracin - Minutos) ?@. 5eali)a el e#ercicio 1.?@ siguien!o las instrucciones !el E#ercicio 1.-E pero a!ems agrega un botn !e En48o ; uno !e Eliminar al +inal !e comentarios ; 7ugerencias. (Duracin - Minutos) ?1. 5eali)a el e#ercicio 1.?1 siguien!o las siguientes instrucciones. 3oloca un soni!o !e +on!o para la pagina WEB2 crea un 48nculo *ue al ser selecciona!o por el usuario se acti4e un soni!o ; coloca una imagen !e tal manera *ue al ser selecciona!a por el usuario se acti4e un soni!o. $8tulo !e la "gina en letra gran!e2 negrita ; cursi4a KAgregan!o 7oni!osL. (Duracin 1@ Minutos)

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

16

?'. 5eali)a el e#ercicio 1.?' siguien!o las siguientes instrucciones. 3rea un 48nculo *ue al ser selecciona!o por el usuario se acti4e un 4i!eo ; coloca una imagen !e tal manera *ue al ser selecciona!a por el usuario se acti4e un 4i!eo. $8tulo !e la "gina en letra gran!e2 negrita ; cursi4a KAgregan!o Ji!eosL. (Duracin 1@ Minutos)

4/N555555

Paginas WEB y Nuevas Tecnologas Ing. Fabiola de la Cruz

17