/751#8"")2/ 3*78-1WC6758"785=-=187 Captulo 9. Estructura y layout '+ (5,-$'+ &,*!'*+ %-+,*& $+ &+ ,!)-,+ !+('&!$+ (* %** 1 +,*-,-** $%&,' !&!.!-$ $+ (3!&+ /; ,$+9 $!+,+9 &$+9 (3**'+9 !%3&+9 ,< -&)- '%!&&' ++ ,!)-,+ + ('+!$ ** -$)-!* (3!& /9 &' + ('+!$ *)-$+(3!&+%-+,*&+,*-,-*+'%($"+< %1'*5 (3!&+ !+('&& +,*-,-*+ '%($"+ '*%+ ('* .*!+ '$-%&+ '&,&!'+ 1 ',*' ,!(' !.!+!'&+< ,!$!2&' 0$-+!.%&, &' + ('+!$ ** +,++,*-,-*+'%($"+91)-+!%(*+!&!$%($*$+ '"++,!$'+ < ' '+,&,9 $'+ +,!$'+ &+!,& $ 1- @ (* ** $'+ !+6'+ %3+ .&2'+< & '&*,'9 $ 7!' + &* *-(* $'+ $%&,'+ $ (3!& & !*&,+ !.!+!'&+ & -&!7& +- !&$!; $ 2'& $ * $ (3!&9 $ 2'& '&,&!'+9 -& 2'& $,*$ (* $ %&8 1 ',*+ +!'&+ %&'*+9 $ 2'& $ (! (3!&9 ,< +!-!&, !%& %-+,* $-&+ $+ 2'&+ !&!+ & $ (3!& (*!&!($ $ +!,!' ///<$!+,(*,<'%; )'85WCOC+$.3-1#$3 ')/"1.3-$+$6758"785#"1/$7)48$76#): * *-(* $'+ $%&,'+ )- '*%& 2'& ' !.!+!7& $ (3!& + -,!$!2 $ ,!)-, <div>; ;;;C-)!516;$!C$6 119 3*78-1WC6758"785=-=187 <div> /751#8"")2/ ):)6)1/$6 Atributos comunes ! 6)"16A)OV/=$:$/716 Atributos especficos G Tipo de elemento -148$ Descripcin '583$-$.$/716#$!-148$ $ &'%* $ ,!)-, div ,!& +- '*!& & $ ($* divisin9 1 )- +, ,!)-, !& 2'&+ ' !.!+!'&+ &,*' -& (3!& < & -$)-!* +'9 +! ,''+ $'+ !+6'*+ / -,!$!2& $ ($* "capa" (* **!*+ -& E!.!+!7&E< -&)- + ,*, -& **'* *. B$+ (+ + *& %!&, -& (*'(! $$% z-indexC + (**!$ +-!* $$%&' "capas" $+ 2'&+ !&!+ '& $ ,!)-, <div> (* ('* &,&*+ '& $ *+,' !+6'*+< + (3!&+ / '%($"+ )- +,3& !& !+6+ -,!$!2& &+ ,!)-,+ <div>< '& %- !*&!9 $'+ ,*!-,'+ %3+ -,!$!2'+ '& +, ,!)-, +'& id B(* !&,!!* $ ( '*%8&!C1 class B(*($!*$(+,!$'+ C< ' + . (*'-&!2* & $ (*'+' !+6* -& (3!& / %!&, <div>9 1 )- &' + ('+!$ !+6* -& (3!& / '%($" -,!$!2&' $%&,'+ <div> +!& -,!$!2* '"+ +,!$'+ < '* 8$,!%'9 +! '+*.+ $ 7!' $-&+ (3!&+ / '%($"+9 .*3+ )- $ %1'*5 -,!$!2& $'+ %!+%'+ &'%*+ (* !&,!!* +-+ !.!+!'&+< '+ &'%*+ %3+ '%-&+9 1 +-+ )-!.$&,+&!&$4+9+%-+,*&'&,!&-!7&; contenedor BwrapperC+-$&***$%1'*(*,$'+'&,&!'+$(3!&1+ %($(*!&!*$+*,*5+,!+3+!+$(3!&;+-& -*9+-+'*+9 !%3&+$,*$+9+!+&,*'&'*+(,'$.&,&$&.'*9,< cabecera BheaderC)-!&$-1,''+$'+$%&,'+!&.*!&,+$(*,+-(*!'*$ (3!&B$'',!('9!%&'&&*9-*'8+)-+-(*!'*9,<C contenido BcontentC&$'$'&,&!'(*!&!($$+!,!'B$2'&&',!!+9$2'& *,5-$'+9$2'&(*'-,'+9,<(&!&'$,!('+!,!'/C menu BmenuC+%($(**-(*,''+$'+$%&,'+$%&8$,*$&.!7& $(3!& pie BfooterC)-!&$-1,''+$'+$%&,'+!&.*!&,+$(*,!&*!'*$(3!& B.!+''(1*! ,9('$5,!(*!.!9,4*%!&'+-+'9,<C lateral BsidebarC+%($(**-(*$'+$%&,'+$+'$-%&+$,*$+1 +-&*!+$(3!&< +,'*%9$+)-$,'-&(3!& '%($"+-$+*+!%!$*$+!-!&,; ... <div id="contenedor"> 120 ;;;C-)!516;$!C$6 /751#8"")2/ 3*78-1WC6758"785=-=187 <div id="cabecera"> ... </div> <div id="contenido"> <div id="menu"> .. </div> ... </div> <div id="pie"> ... </div> </div> ... $)-!.$&,(*$+(3!&+&!&$4++*5$+!-!&,; ... <div id="wrapper"> <div id="header"> ... </div> <div id="content"> <div id="menu"> .. </div> ... </div> <div id="footer"> ... </div> </div> ;;;C-)!516;$!C$6 121