Top Banner

of 516

Professional Web Developer 2.1 by Ei.maung

Jul 05, 2018

Download

Documents

Sai Laung Linn
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    1/515

    Professional Web Developer 1

    Fairway Web

    Web Standards, HTML5, Ajax, PHP, jQuery Profess ona! Web "e#e!o$er %& '()*+* * -./ )0/1 21)31)

    &4&/ ) 61 7081)*/ &1340 9 $:dboo; ?

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    2/515

    Professional Web Developer

    2.1

    © Copyright 2015, Ei Maung , Fairway Web Development.

    License - CC-BY-NC-SA

    This do !ment, "#ro$essional Web Developer 2.1 by %i &a!ng ” is li ensed !nder aCreative Commons 'ttrib!tion()onCommer ial(*hare'li+e .0 -nported i ense.

    This do !ment is $ree to share, opy, distrib!te and transmit. 'nd, also allow to remi/ oradapt to this do !ment. !t, yo! m!st attrib!te the wor+ in the manner spe i ed by

    the a!thor or li ensor b!t not in any way that s!ggests that they endorse yo! or yo!r

    !se o$ the wor+3. 'nd, yo! may not !se this wor+ $or ommer ial p!rposes. 4$ yo! alter,trans$orm, or b!ild !pon this wor+, yo! may distrib!te the res!lting wor+ only !nder thesame or similar li ense to this one.

    For any re!se or distrib!tion, yo! m!st ma+e lear to others the li ense terms o$ this wor+.

    T % W678 4* #76T%CT%D 9 C6#974: T ')D;67 6T %7 '## 4C' % 'W. ')9 -*%6F T % W678 6T %7 T ') '* '-T 674

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    3/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    4/515

    Profe !o"#$ %e& 'e e$o er 1%+I1

    369 ( )Mode!FJ e:FBo!!e=t on.et&$ Write aintainable Code

    387 ( )HTML5Dream Come True !or Web De#elo er$

    422 ( )Web Ser# =es5ou Don&t Ha#e to Do That 6y 5our$el!

    432 ( )K STfu! KL"#erything i$ e re$entable 'lready+ 6ut How about ore4

    437 ( )Mob !e Web77 Problem$, 6ut obile 'in&t ne+

    452 ( )Web A$$! =at on Se=ur tyPre are 5our$el!+ 6ad /uy$ are "#erywhere+

    472 ( )Perfor>an=e $t > Nat on6e$t Practice$ !or S eeding % 5our Web Site

    482 ( )Too!s and t ! t es6e Com!ortable with 5our /ear$

    497 *+ *,- Catching % with the Technology

    502 . / ( )"#erything 5ou 8now about en Source i$ Wrong

    509 . / ( )Pic*ing a Web Ho$ting

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    5/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    6/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    7/515

    Profe !o"#$ %e& 'e e$o er I2) )% Xp1 qO4%+ 3 I+ 6

    * ;< =>(01 2 3 )

    * ;< =>(01 2 3 )

    &1340 O4%+ 3 I+ I4+ 3]I 3] ^ 21)cI1) I+)&1)84% Y76& */ 1 &16% 0Z+% *% 31) 0)&I1) 21) cI1 *176& 0_*/ ` *4 +0_

    08 3 I+ 84% Y I4+ Y 31) 0)cI*/ &16% 0Z+% *% 21)VX X16% \ 0() Y6. 3cIRv0] ĉI* 21)V 31)XR 4)I4+ I2) )38 )

    % U+ 0_*/ ` O4%+3 I+ I4+ 7 . 1 4+ RI . 02 %10/1U 3* )./ )0/1&1&' qMBPA Profess ona! Ser es 08 [R 4 ) +% [I &1340

    376& %1Y. 84% Y 0)] *̂/ 3% I Y ) 7 1I w4 +*I *̂4 +7 . 1 4+ RI . 02 %10/1U 3* )31)X/ ) 38 ) I2) )

    % U+ 0_*/ ` 08 3 I+ O4%+ 3 I+ & I+ XR 4)3% I 2I 16R 4 )O( 4+ ) 21)I4+ % 176 Z)[ ^ 0)] *̂ I4+ 2 +) 1 1

    I4+X/ ) I2) )38 )% U+ 0_*/ `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    8/515

    Profe !o"#$ %e& 'e e$o er I2) )% Xp1 q08 3 I+ 7

    * ;< => (-: 3 )

    Iz. %1 I4+ Web "e#e!o$er %& 1I 76& X1 31 X )70 0) 0()&1340 3% I 3 1&1 Z)*1) 0)] ^ *1 I4+Z1{(V &1340 Z)*1)Z.

    %4+I % . )] ^ *1 Iz. %1 .() ) YX V &1340 76& 7 1I Z)3% I 3cIRv0I /( 0)] ^ *1 I4+7 % * V I . 02 %1./ )0/1 &% X X1&' I

    3 I I 0 R 04+) 0)] ^ *1 Iz. %1 '() X) '()7 X+ .()V+*1)&4 Z)Z1 21)% Iz. %1 0/1 Z)I4+ 08 '()&1) 0)

    3 *̂% % v0&4 02 +) 81 0)] ^ *1 Iz. %1 3 qI X . Iz. %1 3 6%4 +I4+ &1340 76& 7 1I X1*/ 3% I

    I2) )38 )% U+ 0_*/ `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    9/515

    Profe !o"#$ %e& 'e e$o er &1 Z)* 3 1 8

    5 7 ?ent I4+ X X1X4+* 21) 6% \ * 0_*/ ` Web 0I *I */ ./ )0/1 21)I4+ 3 7]]R & XI %I2I2&R 4&R 4X X 61 7081)*/ 3% I V *+U+ * */

    ./ )0/1 21)I4+ %& .Z1%/ )% &4&/ )*+U+ * 1) & 4+ / 76& 0_*/ `

    A &1340 31) XI %X40 . )] % 3X40 X40 I4+ .*/ Dun or Web "e#e!o$er 21) 6% \ * 0_*/ ` %1Y. I2Z1./ )0/1I4+ 3*1) 0) X X1 .Z*/ 3% I X X176& *)0 Î2. U+ .*/ ./ )0/121)I4+ 76/ & I *+U+ Z & 4+ / 76& 0_*/ `

    A &1340 31) 3 %3hIRU+ Sen or Web "e#e!o$er 21)X/ ) 6% \ * 0_*/ ` + +*+U+ Iz )I2 81)0R 4 % I ^ 701)*/ 61 700R 476& ] X̂- V \ 81 *& 37 *& 21) 76/ & I ZU+ 4+ 0_*/ `

    A &1340 31) Web "e#e!o$er g4% */ "es;to$, Mob !e, |a>e, "atabase &*/ 37]1) Soft:are21) Z)*1)6. %() .* "e#e!o$er 21)X/ )6% \ * 0_*/ ` Soft:are "e#e!o$>ent 3 7]]R]2 )% *1

    X/ ) ./ )0/13 7]]R % */ 3% I Web [4+*/ 1 *()7]1)3]2+. 0) X X1Z / 3Z1%& ]4 *6 76& .4+ 0_*/ ` &1340 I 3]2+. 3 21) I() 0)&Z1 X4+0 ̂Web ./ )0/1 21)I4+ %& .Z1%/ ) v]R R 4*+U+ * 1) 31

    I /( 0) 4+ / 76& 0_*/ `

    A &1340 31) Tea> Leader 21)V Bk }BT 21)V Soft:are "e#e!o$>ent 0I *I */ X40 . )%& ]4 ]4 I4+ '() [1 .Z* 21) 6% \ * 0_*/ ` Web ./ )0/1 21) [I &0 0R 4 76& &' Z/ \ ]2I 21)I4+*+U+ Z 4+ / 76& *76 V "e#e!o$>ent P!an 21) Z)[ ^ Z1% X/ ) I1 )V ./ )0/1 \ )]2 7] ) [R 4)76% ]2I 21) ]2 % Z1% X/ ) I1 )V "e#e!o$er 21)I4+ X )~p. Z1% X/ ) I1 ) 3 81I 3I 76& & 4+

    / 76& 0_*/ `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    10/515

    Profe !o"#$ %e& 'e e$o er &1 Z)* 3 1 9

    Ber !o" CAD EF5 565+ G EF E O(&1340 Z ̂08 3 I+ 8 I U+ ] ^ 0() 3]2+. q• & ] ^ V q€ & g */ 3]2+. %4+ X) 3% ) 10 HTTP} I *̂4 +

    *1 3 Z)0_*/ ./ )0/1*& % 8 I 0iX1*X4+V HTML5 I *̂4 + *1./ )0/1 % X/ ) XI I8I 21)& 1%4+)%I 701 )X X̂1] ^ 0(76& 0_*/ ` %4+)%I 701 )X X̂1% .̂/ )0/1. 3̂/( &1340 % 61 7081)*/

    3]2I 3XI 21)I4+ ~+ + ) 4+ Z)3% I ]4 Jers on

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    11/515

    Profe !o"#$ %e& 'e e$o er +% [I 10

    Web Te=Cno!o@y

    Iz. %1 g1 Profess ona! Web "e#e!o$er 376& X40 I4+ X1] %̂1 O(&1340 Z)*1)]2+. 1 X40 *I qƒ & I21 ] ^ 0( 76& 0_% ` X40 . )] 1 XI %3X40 % X40 Z ) „ X X1[ 3̂]2+. I*1 O(3]2I % I4+ O(X4+U )

    70* U+ ] Ẑ 3]2+. I4 . 3 %1 *I *1* 1) 10 „̂ X4 + % )76& ] Ẑ% 3̂ cI1 )3Z1 % I4+ O(&1340 1&4&/ ) 61 700)* 1) 1 76& 0_% `

    O(&1I4+ Z) .]2+. 8+ Web "e#e!o$>ent 3 cI1 ) 7 . 1 1*1. ^ 61 7081)% &̂1340 % 3 %1 ./ ) .0_*)% ` 3w…X+0 1*1. ^ %1 3 21) I()U+ 0_% ` O_ 0 3 21)&4I ./ )0/1%& ]4I4+ 3†+I81) 61 70

    cI X U+ 0_% ` 3 Ô(&1340 % g1 3I4+)3I1)376& XI & ^ 81)64 + %1 I1 )0_% ` O_ 0 X X1& Web"e#e!o$er % *+* % .̂/ )0/1 % I4+ &R 4&R 4X X *+Z64 +3% I ./ )0/1%& ]4 &1%& 340 . ). X̂4+I 6%

    .ZZ 3[ 700_ )` &16% .Z%1. ̂3]2+. % I4 . .64 +U+ 0_% ` &1 % X+ 6% . 0() XI % X40 76& Z X/ ) 8+ Z1I 70. 0_ )`

    O(&1340 1 %1 *+* % .̂/ )0/1 21)I4+ XI %I2I2. ̂X4+Z )%4+U ) 61 70 0)* 1) 1 76& 0_% ` Web"e#e!o$>ent 3 cI1 )I4+ 8 8̂ Ŷ Y *+Z64 + 37 . [R 4)X )I4+ 61 70 0)81)% ̂SCort=ut X4 + [4+]2 0_% `3 7]]R I1 ) % 0)X4+I 176& X4 + [4+ Z1./ )0/1 1 Iz )I2 * %& 1I 76& X1 31 [I XI 0()Se!fFStudy X40 * 1) 4+ X )&I4+3]4+ 3 1ZU+ * 1) 10_` %& ]2+. %/ ) 10 ̂XI %X40 . )] 1 76& .X4+30 % 3̂04+ ) % I4+ 3†+I81) 61 70* 1) 176& X4 + ]2I 7] )3X40 76& 31 X/ ) I /( 0) &1340 %& 340 76& 0_% `

    3]4 .1I 04+ ) 1 3 %1.I ./ )0/1 % 3X- 37 . 6R‡6+)%4+)%I X17] ). 3̂% Soft:are "e#e!o$>ent g1X/ ) 3* )*ˆ1. 701 )X X̂1] 0̂_ ` Gus ness So!ut on, Persona! Produ=t # ty A$$, Bo>Soft:are, |a>e &*76 Soft:are 3 2 +)3&1) % . ̂"es;to$, Tab!et, S>art$Cone &% ̂3 Ô( Soft:are %3X40 X40 % ̂"e# =e % X4+0 ̂I ^ 701) .0_ &V Soft:are 3 21)&4g1 3 %1.I I . I I4+ 3*R 4 )]281)% ^" str buted Soft:are % 76& X1cI 0(76& 0_% ` " str buted Soft:are % 1 B! ent, Ser#er . ̂Bo>>uFn =at on Proto=o! [4+ 0() 3&+% 304+ )*R 4 )Z0 0_Y X U+ 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    12/515

    Profe !o"#$ %e& 'e e$o er +% [I 11

    B! ent 3 2 +)3&1) & 2 +)U+ % X4 + [4+ 4+ 0_% ` ‰at #e B! ent . ̂Web B! ent 76& 0_% ` '0 1 F |>a ! [4+cI0_&4 +` |>a ! I4+ "es;to$ Bo>$uter %& XR 4 ) 1 M =rosoft ut!oo;, TCunderb rd &% ̂ >a ! Soft:are % . ^3*R 4 )v0 4+ 0_% ` 3 Ô( Soft:are % I4+ ‰at #e B! ent X4 + ]i0_% ` ‰at #e B! ent % I4+ *I [4+ Z1"e# =e 1 knsta!! X40 81) 4+ 0_% ` ‰at #e B! ent 370 |oo@!e BCro>e, MoN !!a E refox &% ̂WebGro:ser I4+ 3*R 4 )v0 0()@>a ! I .%& [ X/ ) |>a ! I4+3*R 4 )v0 4+ 0_% ` O(X4+ Web Gro:ser I4+B! ent 3 .. ̂ 3*R 4)v0X4 +Z 31 6. %() 0)81)% ̂@>a ! I4+ Web B! ent X4 + ]i0_% ` 3X1)% 0 ^Mob !e "e# =e % 1X/ ) knsta!! X40 81)% ̂‰at #e >a ! A$$ % . ̂|>a ! I4+ 3*R 4 )v0 4+ *X4+V Mob !eWeb Gro:ser I .@>a ! Web B! ent I4+3*R 4 )v0 0() %1 X/ ) *R 4 ) 4+ 0_% `

    O(&1340 1 ‰at #e B! ent % 3 cI1 ) 61 70 1 g4% 0_ )` Web Gro:ser I .3*R 4 )v0Z% ̂Web B! ent %%/ [1I 0R 4 I4+ 61 70 0)* 1) 1 76& 0_% ` O_ 0 V O(&1340 1 61 70 Ser#er ./ )0/1 21). ̂HTTP

    Proto=o! %4 +I4+ %1 / */ Soft:are 3 2 +)3&1). 3̂% % ^ 6I 3*R 4 )v0 4+ 10 ̂76& 0_% `

    http://gmail.com/http://gmail.com/http://gmail.com/http://gmail.com/http://gmail.com/http://gmail.com/

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    13/515

    Profe !o"#$ %e& 'e e$o ŠWeb "e#e!o$er %4+ ) *+U+ .1)X/ * */ . 0 31)XR 4 )

    .()0_)I4+ 3 7]]R & \4+)\4+)U )U ) 3 *)&+0 61 7081)*76 Web "e#e!o$>ent I4+ X X1* %4+ ) 6% * *1 U 1)U 1)0_)0_) 7 . 1 1*1. ^ Z)*1)81)% ̂&1340 I1 )%& 340 ‹

    KI4+ I21 1Y ) qSr< Web "e#e!o$er, ŒuuNoo‰o: Pte

    AutCor >a !Ž autCor $:dboo; Webs teŽ Ctt$Ž}}$:dboo;

    mailto:[email protected]://pwdbook.com/http://pwdbook.com/mailto:[email protected]

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    14/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    15/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 1

    3*R 4 )v0X1cI0_% ` O( ‰et:or; % g1 I .]% . ^ + ) ' Z Pr #ate ‰et:or; *1*1 -*1 U+ 0_ *)% `

    3 7]]R./ )0/1% 0 % I ^ 701)% 3̂ *)&+% k>$!e>entat on % cI1 ‰et:or; % %& ]4. %̂& ]4]2+% [I 64 + I+)&1)% ̂3]_ 1 %1 3]I hIRX1Z70. 0_% ` O(70™.1I4+ 76U )64 + AKPA Z ̂Sate!! te ‰et:or;Pa=;ets Proje=t 1X40 .% ̂Kobert laCn . ̂&%. )64 +%Im*4+X I J nt Berf %4 +0 ) 0_ ) 0() % /(% ^.I Y0 &.& % 3% I cI1)]R Mas; %& ]4 3 .. ^ [1 \ I 0) 4+ % ̂ Proto=o! %& ]4 I4+6. )%() 0)] 0̂_% `•‘“” ]4 & O( 1 1 61 84% ] %̂ ̂3 Ô(./ )0/1I4+ „knternet Trans> ss on Bontro! Pro@ra>„ X + ]i] 0̂_% ` 3 Ô( Proto=o! I ‰et:or; Z ̂%1Y. I4+ X-1 ]2 0() I . 02 %1I4+ 3†+I3X40 X40 ]4+ )X4+I % ̂./ )&.& %& 2 +)76& 0_% ` ZXO 3 .. ̂‰et:or; % 3]2 )]2 ) ]2+% [I 4+ X17] )0 7̂6& 0_% `

    AKPA I X4+30 % ̂% ^ 6I Soft:are % I4+0_ %/ [1I 0() •‘““ ]4 & 1 %1 % I ^ 701)% .̂I Y0 *R 4 )]4 I4+31 31 7 7 ]2+% [I 4+ ] 0̂_% ` •‘ƒ• ]4 & 1 %1 „Te!e=o>>un =at on Proto=o!Proto=o! qTBP}kP „ [4+% ̂3 / . ̂O(./ )0/1I4+ 3 0()*% cI7 1 4+ ] 0̂_% ` •‘ƒ€ ]4 & Z1I % ̂3]_ 1TBP}kP I4+ 37]1) 36 ^ 3&/ ) % I0_ &% 3*R 4 )v0X1cI0_% ` %& I 1XR 4)3%4+ )3%1. ̂ I . 02 %1‰et:or; % I4+ ]2+% [I 0) %1 3 %1.I I . I I() 3&v0] ^ 0(0 7̂6& 0_% `

    I . 3]2+. 1 %1 3 %1.I I . I I()8 ^ 1 I . 02 %1 % *1 IV 4+ 4+ )64. ) % V Tab!et % . ^37]1) *1 "e# =e 0_ ) ƒa ! &% ^./ )0/1 % I [1 \ I 0)%10_` >a ! . ̂Wor!d W de Web I4+ 3]2I 3XI % ]Z() Z1I 31 04 +

    0)% ̂„I1)„ X4 + [ 0() 3 %1.I I %1 3 Ô(I1) % * 1)X4 +Z% ̂ „X )„ X4 + * 181) 4+ 0_% `

    Wor!d W de Web . ̂ >a ! %4 +X4+0 ̂3 %1.I X ) I() 0i 1 3]2I 3XI % * 04 + [1 0) 4+ % ^37]1) ./ )0/1 % U+ 0_ *)% ` knstant Messa@ n@ qkM , knternet Ke!ay BCat qkKBknternet Proto=o! qJokP , Se=ure SCe!! qSSH , E !e Transfer Proto=o! qETP &% ̂./ )0/1 % 76& 0_

    % `DAC K %or$R %!Re %e& (%%%)•‘‘— 70/ & Y. )I2 1 |o$Cer X4 + ]i% ̂3 %1.I I . I I4+3*R 4 )v0 0() 3]2I 3XI % I4+U 1 6 76. Y

    0) 4+ % ̂ &.& %& ]4I4+ &% 3*R 4 )v0X1cI0_% ` %Im*4+X % 1 3 %1 X)I2 I2 70. 70. *R 4)] %̂ ^./ )0/1%& ]40_` %Im*4+X %& ]4XR 4)Z 3̂]2I 3XI % I4+ %& .Z1%/ ) 1&4&/ )81) 4+ 0() |o$Cer &.& . ^I . 02 %1 % I [I * Z 4+ 7] )76& 0_% `

    |o$Cer ./ )0/1I4+ 6. %()] %̂ ̂ .([4+)%1)%Im*4+X I •‘‘š ]4 & 6 61 Y_Z(X 1 3 7]3 . % I4+ 70 )

    X *̂ 1) &% ̂ cI7 1]2I %& Z0 I4+ ]2 % ] 0̂_% ` |o$Cer ./ )0/1I4+ 3*R 4 )v0* % I 3*R 4 )v0] 0)Z

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    16/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 15

    X4 + cI7 1] 7̂] )0 7̂6& 0_% ` O( cI7 1]2I cI1 XI U+ |o$Cer ./ )0/13*R 4 )v0 .* % I4+ 37]1)./ )0/1%& ]4]4 701 )*R 4 )64 +&' )&1)X1 &0_% `

    3 Ô(3]2+. 1 [ & 1X. 4+ R3 7]&4+I B K‰ qTCe uro$ean Boun= ! of ‰u=!ear Kesear=C Ben 3̂6 ^ 3&/ )8R 1 |o$Cer I4+ 3&1)84+) 4+ % .̂/ )0/1%& ]4I3* U+ .0_% ` B K‰ I I . 02 %1 *+0R˜0/1U %& '()76& % ̂T > GernersFLee I "o=u>ent % 3% ) 1 37]1) "o=u>ent % I4+ Z/ ~p. )]2+% [I 4+ % ^./ )0/1%& ]4I4+ 6. %()81)0_% ` Hy$ertext "o=u>ent X4 + * I ]i0_% ` XI %3*R 4 )v0 4+ 64 +3% I V"o=u>ent % I4+ 76. Y 0) 4+ % ̂Ser#er Soft:are %& ]4. ̂3 Ô( "o=u>ent % I4+ Z 0) 4+ % ̂Gro:serPro@ra> %& ]4 I4+X/ ) 6. %()] 0̂_% ` 6. %() 31)XR 4 )I4+&4 0_ ) 0() „Wor!dW deWeb„ X4 + * I 3 / 0)81)0_% `

    T > GernersFLee I •‘‘š ]4 & V › 0(X q•š ZI . 1 Wor!dW deWeb ./ )0/1Z ̂Sour=e Bode I4+3 21)Z 4+ 64 + 61 70 0)] 0̂_% ` O_ cI1 O(./ )0/1I4+ / * [4+ 3] Ẑ 3*R 4 )v0] ZX1 R 4 I [I &0 ./ )0/1 21)I4+0_ %(8 X1 4+ &] 0̂_% ` O_g1X/ ) 3X / 3 701 )%& ]4 I4+ 76& 0i &] %̂ ̂ [R 4)76% ]2I %& ]40_0 ^̀ 3 Ô( & 8 ^ 1 3 Z+I. 70/ 81 &4I ‰BSA q‰at ona! Benter of Su$er=o>$ut n@ AI Hy$ertext "o=u>ent % I4+cI/ \ 4+ 0() |o$Cer I4+X/ ) [I XI 3*R 4 )v0 4+ % ̂Web Gro:serPro@ra> %& ]4 I4+6. %()] 0̂_% ` Mosa = X4 +3 / 0)] 0̂_% ` n x $erat n@ Syste> 1 3*R 4 )v0 4+ 64 +6. )%()] %̂10_` O_ 0 •‘‘š ]4 & O( 1X 1 Ma= . ̂W ndo:s %4 +3% I *()7]1) Jers on % I4+ 6. %()

    0)] 0̂_% ` 3 Ô(3]2+. I& 0() Mosa = . ̂Wor!dW deWeb g1 3X- 37 . I21 cI1)X1] 0̂_ %1 % `

    Mosa = I *̂4 + Web Gro:ser % X/ ) %& ]4 0()%& ]4 0i 0_I X1] 0̂_% ` 3 21)&4I %1 %Im*4+X %Bor$orate % Z ̂ *4 %*. Proje=t 21)3 .. ̂ 0i 0_I X1] %̂10_` I .3]2+. 1 %1 Web X4 +3%4+ I1I ]i% ̂Wor!d W de Web g1 3 %1.I X ) I() 0i 1 3]2I 3XI % * 04 + [1 0) 4+ % ̂./ )0/1 21)8 Î 3†+I3I2[R 4 )./ )0/1 76& X1] ^ 0(76& 0_% `

    Web ./ )0/1 1 3†+I3&+% 304+ ) qš ]40_Y 0_% `

    D K ST erJeMJ 'oOIUe"JI . 3]2+. 1 Web "o=u>ent X4 +04+ 0()3 ]i 21)% ̂Hy$ertext "o=u>ent % g1 &1. ^ Z)*1) 61 7081)% ^

    3]2I 3XI % 370 V &1Z ) 1)0R 4&R Tab!e . ^ 61 7081)% ̂3]2I 3XI % V \40 0R 4 qk>a@e % . ̂3]2I 3XI % 76/ * )X4 +Z% ̂ Eor> % 0_Y 4+ % ̂"o=u>ent 21)76& 0_% `

    O( "o=u>ent % I4+ Hy$er! n; ]i 3~ . ) % . ̂370. 3X . ]2+% [I 4+ cI0_% ` Hy$er! n; %& ]4I4+ + 0 0()"o=u>ent %& ]4I . .1I "o=u>ent %& ]4 I4+ 3X %& I I ) 701 )cI/ \ 4+ 176& 0_% `

    C K %e& Qer erWeb Ser#er [4+%1 Web "o=u>ent % I4+ I . 02 %1%& XR 4). ̂&4&/ )*+ )[/ )81) 0() 70. X/ Z X4+% 3̂]_Z 4+ 31 &( R 0)81)% ̂&.& %& 2 +)76& 0_% ` "o=u>ent % &4&/ )81)0R 4 I 3]. ) % 3 21) I()0_% ^

    I . O4+%4+I I()%& XR 4 ). %̂ 0_% ` Web "o=u>ent % I %1 3 Ô(%4+I I()8 ^ 1U+ .% ̂ 3]. ) % [4+0_&4 +`

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    17/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 16

    I . O4+ %4+I I() 1X+0 &1U+ *X4+ 3]. )%4+ )3% I X/ ) I4+ 04+ 3]. ).R0_% % U+ 0_% ` Web ./ )0/1 1%1 %4+I X+0 &1I4+ "o>a n ‰a>e X4 + ]i 0() 3]. ).R0_% 3~ . )I4+ KL q n for> Kesour=e Lo=ater +]i0_% ` Web KL %& ]4g1 3+ X+0 &1%& ]4. ̂3 %1 X)% 0_% ` -V 1 ( W ) 1 X X1cI/ 0_`

    -V 1 ( W ) KL %& ]4 3†+0˜_

    KL g1 Web ./ )0/1Z ̂„3*I „ 76& 0_% ` Web Kesour=e %4+ )I4+ %4+I \4+I ~ . )[4+ 4+ % ̂ KL %& ]4U+ Z V U+ 31 6. %() 0)Z [4+%1I4+ Web "e#e!o$er %4+ ) .1)X/ 81)Z 3]2I %& ]2I 0 7̂6& 0_% `

    X K %e& YroZ erWeb Gro:ser I %1 Web "o=u>ent % I4+ 61 70 0) 4+ % ̂Soft:are %& 2 +)76& 0_% ` Mosa = X4 +3 / Z% ̂08 [R 4) Web Gro:ser I %1 I .3]2+. 1 U+ %1 0_ )` O_ 0 X *R 4 )3 21)[R 4 ) Gro:ser %8 Î M =rosoft knternet x$!orer . ̂MoN !!a E refox %4 +g1 Mosa = I .[ )*I X1cI7] ) 76& % X4 +[4+ 4+ 0_% `

    XI U+ 3]2+. 1 X *R 4 ) 21)% ̂Web Gro:ser q’ ]4 U+ 0_% ` M =rosoft knternet x$!orer, MoN !!a E|oo@!e BCro>e, A$$!e Safar . ̂ $era %4 +76& cI0_% ` 4+ 4+ )64. ) % . ̂Tab!et % I .X/ ) 3 %1.I 3*R 4 ) 21)X1cI% 3̂% I Andro d Gro:ser, Mob !e Safar . ̂ $era Mob !e %4 +X4+ Mob !e Gro:ser %X/ ) 3*R 4) 21)% ̂Web Gro:ser &1Z )8 ^ 1 8/ * )Z 10_`

    Web Gro:ser %& ]4Z ̂3 7]]RX40 . )%1Y. I %1 V 3*R 4 )v0* 0)% ̂ KL X+0 &13%4+ ) Web Ser#er U+ Z1I4+* 1) 0()V Web Ser#er I70. 0)X4+I % 3̂]2I 3XI % I4+ 3*R 4 )v0* cI/ \ 4+ 31 61 70 0)64 +0 7̂6& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    18/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 17

    -V 1 ( W ) Web Gro:ser %& ]4 3X40 X40 0R 4Sour=eŽ:::ent % Z)*1)6. %()cI* % V Web Ser#er %(8 6. %()cI* % V Web Gro:ser 84% X40 * % 30_3Y Web ./ )0/1. [̂I &0 3X40 X40 * 21) X4+I .1 3*R 4 )v0Z

    ./ )0/1&R 21) *% % 7] )0 7̂6& 0_% ` O(X4+./ )0/1&R % *% % Z1 1X/ ) W B I 3 %̂ )0/1U % *1 I |oo@!e, M =rosoft, MoN !!a, A$$!e, Adobe, $era 3&U+ % ̂ XI U+ 3 %1.I . ̂Web./ )0/1 1 '() [1 .% X̂40 . ) 21)I 0/1U 21)X ̂0 ) 0_ )0_Y [1 \ I .cI%10_`

    W B I *% % 81)% ̂./ )0/1&R % I4+ Web Standards X4 + ]i 0() HTTP, B|k, HTML, ŸHTML,S AP, " M, BSS, SJ|, K"E &*76 Iˆ 0_ ) 21)& 1 0_Y 0_% ` 3 Ô(8 Î Iz. %1 %4 + 3†+I81

    X X1Z 1 % I %1 HTTP, HTML, BSS . ̂" M %4 + 76& 0_% `

    http://www.vladstudio.com/wallpaper/?how_internet_workshttp://www.vladstudio.com/wallpaper/?how_internet_workshttp://www.vladstudio.com/wallpaper/?how_internet_works

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    19/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 18

    DA\ K ST er]eMJ ]r#" fer ProJoOo$ (S]]P)-V 1 ( W ) 1 KL Z ̂ U [R 4 )I Ctt$Ž}} I4+ „&()* 1)Z I1)X4+ )„ X4 + 61 70] 0̂_% ` HTTP [4+%1 Web"o=u>ent % 30_3Y 3]2I 3XI % I4+ Web Ser#er . ̂Web B! ent Z ̂cI1)8 ^ 1 370. 3X . * 04 +

    [1 0)% ̂./ )0/176& 0_% `

    Web B! ent [4+%13 7]]R31)76 Web Ser#er %& ]4. ̂ [I * [1 \ I 4+ % ̂Soft:are % I4+ WebB! ent X4 + ]i0_% ` Web Gro:ser g1 Web B! ent %& ]476& 0_% ` Ser#er I4+ [I * 0() 3]2I 3XI

    % Z &( R 4+ % ̂‰at #e A$$ 21)g1X/ ) Web B! ent 21)0 7̂6& 0_% ` Web B! ent I 3]2I 3XI 21)Z 64 + [1 \ I % X̂40 . )&' I4+ Ke uest X40 % X4 + ]i 0()V Web Ser#er I 3]2I 3XI 21) 70. X/

    0)04 +% X̂40 . )&' I4+ Kes$ond X40 % X4 + ]i0_% ` Web B! ent I 3]2I 3XI 21) %1 ) 7] )I4+3†+I [1 \ I 176& 0() Web Ser#er I %1 %1 )]RX1% 3̂]2I 3XI 21) 70. X/ 0)04 +7] )I4+ 3†+I

    [1 \ I 176& 0_% `

    HTTP I %1 3]2I 3XI Z X4+* B! ent . ̂3]2I 3XI 0)04 +* Ser#er %4 +3cI1) 370. 3X . X4+I .1Z ./ )0/1&RI4+ *% % 0)81)7] )0 7̂6& 0_% `

    [$!e"J Ne^Ie JHTTP *I % ]2I 3Z Web B! ent %& ]4g1 3]2I 3XI Z X4+Z Web Ser#er 8RI4+Z X4+ cI )*% ) 0)04 +Z 176& 0_% ` *% ) 0)04+Z Eor>at 0R 4 &R. .1I O(X4+0_ F

    GET /foo.html HTTP/1.1 Host: example.com User-Agent: Mozilla/ .!

    Accept-Enco"ing: gzip# "eflate$f-Mo"ifie"-%ince: T&e# '( )e* '!1+ ! :+,:1( GMT

    O(*% ) 0)04 +]2I I4+ Ke uest Header X4 + ]i0_% ` 08 [R 4 )X4+ )I _`] I4+ Ke uest MetCod X4 +]i0_% ` HTTP 1 | T, P ST, P T, " L T &% ̂Ke uest MetCod % 3 2 +) 2 +)U+ 0_% ` Z/ \ ]2I 0i %/ 0() * %1 % ̂Ke uest MetCod I4+ 8/ * ) 0)04 +Z 1 76& 0_% `

    3 7]]R31)76 3]2I 3XI % Z X4+Z | T MetCod I4+*R 4 )Z0_% ` 3]2I 3XI *& % Ser#er 16. %() &X4+Z %1 P ST I4+ *R 4 )Z0_% ` Ser#er 1 U+ .% 3̂]2I 3XI % 70 [ &X4+Z %1 P T I4+*R 4 )Z 0()V 3]2I 3XI % 0 62I &X4+Z " L T I4+*R 4 )Z0_% ` H A" K, " G |, TKABl, TKAB&% ̂37]1) Ke uest MetCod % X/ ) U+ 0_ *)% `

    Ke uest MetCod .1I 1 Z X4+% ̂"o=u>ent KL I4+ 61 70Z0_% ` KL .1I 1 3*R 4 )v0X4+% ̂HTTPJers on I4+ [I XI 61 70 0)Z%10_` . .1 Ke uest Header Z ̂O4%+ X4+ )I %1 Ser#er X+0 &176& 0()%%+ X4+ )76& % ̂ serFA@ent I %1 XI U+ %1 ) * B! ent 3 2 +)3&1)I4+ 8/ * ) 61 70 0)7] )0 7̂6& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    20/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 19

    O_370 &%4%¡X4+ ) 1 76/ & I XI ]R 4+ % .̂/ )0/13]2 +I4+0_ 8/ * ) 0)81)%1I4+ %Z0_X+ ` O(76/ & I ./ )0/1 % 3 cI1 )I4+ ( ) [o"Jro$$!"a Jbe `" !ro"Ue"J 1 [I XI 61 70 0)0_

    `

    . .1 Ke uest Header Z ̂ .1I [R 4 )X4+ )I %1 V 3]4 %1 ) % 3̂]2I 3XI g1 0)81)% ẐI & ^ .1I 04+ )Ser#er 0i 1 701 )X 7̂0 [ 81) *1 70. X/ 0)04 +0_X4 + 3*+ 0)81)%176& 0_% ` O_g1 HTTP I*% % 81)% ̂Ke uest Eor>at . .1%& ]40_` %1 ) % ̂B! ent . ̂ %1 ) Z7] ) Z/ \ ]2I 0i

    %/ 0() 0_Y % ̂3]2I 3XI % I ^ 701)* 1) 4+ 0_% `

    3*R 4 )v0* %& 1I I Gro:ser Address Gar 1 KL %& ]4I4+ \4+I 8/ X4+I Z Web Gro:ser I HTTPKe uest Eor>at 376& 3X4+3 X-1I 701 ) 0() Ser#er 8R 0)04 + 0) 176& 0_% ` O(X40 [1 ]2I g1

    Gro:ser I 3X4+3 X-1I [1 \ I * 1)%176& X4 + Iz. %1 %4 + 7 Z0_ )` % 7 X4+% [4+Z "e#e!o$Fer Too!s % I4+3*R 4 ) v0Z0_% ` Iz. %1 3*R 4 )v0% ̂Too! I %1 L #eHTTPHeader X4 + ]i% ̂ E refoxAddon 0 7̂6& 0_% `

    -V 1 ( Wc) L #eHTTPHeader E refox AddonL n;Ž! #eCtt$CeadersoNde#

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    21/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 20

    Qer er Ne o"RSer#er I4+ Hard:are Ser#er . ̂Soft:are Ser#er 376& & 04+ )] ^ cI/ 64 +X4+0_% ` Hard:are Ser#er g13 7]]R31)76 HTTP . ̂%4+I \4+I *I [4+ 7] ) U+ 0_ )` L nux, M =rosoft W ndo:s Ser#er & ̂Ser#er

    $erat n@ Syste> %& ]4 Kun . 0() Web "o=u>ent . ̂37]1)X4+30 % ̂ E !e % I4+ *+0 [/ ) 0)81)% ^PCys =a! Ma=C ne %& ]476& 0_% `

    Soft:are Ser#er I HTTP Ke uest 0i %/ 0() * %1 % 3̂]2I 3XI 70. X/ 0)04 + 4+ %10_` A$a=Ce,‰@ nx, kkS qM =rosoft knternet knfor>at on Ser# =e %4 +g1 3*R 4 )3 21)[R 4 ) HTTP Web Ser#er Soft:are

    % 76& cI0_% `

    4 * d d PCys =a! Ma=C ne 76& % ̂Hard:are Ser#er %& XR 4)8 ^ 1 Web Ser#er 370 37]1) Soft:are Ser#er %

    U+ . 4+ 0_ *)% ` >a ! Ser#er, ETP Ser#er, SSH ser#er &*76 76& 0_% ` *I [4+ Z1 Ser#er %& ]4]2 )&( I4+Y 0_I 3 % qPort ‰u>ber % ] ^ 7]1)*% % 0)81)0_% ` O_ 3 0_I IY X1% ^ Ke uest [4+Z * I %1Y. [1 \ I Z X ̂[4+%1I4+ *+ 4+ 176& 0_% ` HTTP Web Ser#er 3% I "efau!t Port ‰o< I %1

    ¢£ 76& 0_% ` Y 0_I ¢£ I Y Z1I X1% ̂Ke uest 31)XR 4)I4+ HTTP Web Ser#er I %1Y. [1 \ I 0)* 1) 176& 0_% ` 3*R 4)v0* I Gro:ser Address Gar 1 KL 8/ * )% 3̂]_ 1 Port ‰o< I4+ 8/ 0)] Ẑ Gro:ser I¢£ I4+0 ̂3X4+3 X-1I 3*R 4)v0 0)* 1) 10_` Web Ser#er %& ]4I4+ Port ‰o< 701 ) 0() Sett n@ X40 0R 4 I4+ ( )[o"Jro$$!"a Jbe `" !ro"Ue"J 1 61 70 0)0_ `

    Web Ser#er %& ]4Z ̂3†+I3X40 I %1 Ke uest %& ]4XI ]RZU+ %1. ̂Ke uest Header . 3̂% 0_Y X1% ^*% ) 0)04 +]2I 3%4+ ) * %1 % 3̂]2I 3XI I4+ 70. X/ 0)04 +64 +0 7̂6& 0_% ` 8 )7]1)]2I I %1 3]2I 3XI % I4+ 70. X/ 0)04 +] * IX/ ) B! ent 8R *% ) 0)04 +]2I %& ]2 + 3Z 0)04 +0_ *)% ` O_I4+Kes$ond Header X4 + ]i0_% ` HTTP Kes$ond Header . .1%& ]4 I4+ 61 70 0)X4+I 0_% F

    HTTP/1.1 '!! ate: Mon# !, Mar '!1+ 1,:!+:10 GMT

    %er er: Apache/'.'.1, 2Unix3 PHP/ .+.1 4ast-Mo"ifie": %&n# !+ Mar '!1+ '!:1 :++ GMT

    5ontent-Enco"ing: gzip5ontent-4ength: 1,,0

    5ontent-T6pe: text/html7 charset8&tf-0

    Kes$ond Header Z ̂08 [R 4 )X4+ )I 3 7]3 .I4+ Bode .R0_% *R 4 ) 0() 61 70 0)%176& 0_% ` ££ l Z ^3†+0˜_ I %1 XI ]RZU+ % ̂Ke uest g1 31)XR 4)3[ 70 0() 3]2I 3XI 70. X/ 0)64 +X/ ) 3* 0_0 ^[4+% ̂3†+0˜_ 76& 0_% `

    HTTP Status Bode .R0_% % 3 21) I()U+ 0_% ` 340 &4 q’ &4] ^ 7]1)81) 0() q‚xx . &̂% ̂ Bode % I %1*% ) 0)04 +Z. *I *I 76& 0_% ` q xx . &̂% ̂Bode % I %1 Ke uest}Kes$ond 31 31 7 7

    [1 \ I 4+ cI1 ) 61 70% ̂Bode % 76& 0_% ` q xx . ̂&% ̂Bode % I %1 Ked re=t X4 + ]i% ^X+0 &1 701 )X *̂ 1) cI1 ) *% )04 +% ̂ Bode % 76& 0_% ` q¤xx . &̂% ̂ Bode % I %1 B! ent rroI4+ 61 70% ̂Bode % 76& 0_% ` %./ )31)76 0)04 +X1% ̂Ke uest 3 1) cI1 76& 0iX1% ̂ rror

    % I4+ 61 70 0)%10_` q5xx . &̂% ̂ Bode % I %1 Ser#er rror 3% I 76& 0_% ` Web Ser#er I

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    22/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 21

    Ke uest I4+ 3[ 70 70 XI ]RZU+ 0 3]I 3] %̂& &R 4 %& Z1 cI1 70. X/ 0)04 + 4+ 7] ) U+ % 3̂]_ 61 70% ̂Bode % 76& 0_% ` HTTP Status Bode % 8 Î %Z X U+ % ̂ Bode 3]2 + 3 cI1 ) 8/ * ) 61 70X4+I 0_% `

    200 OK XI ]RZU+ % ̂Ke uest 3[ 70 0() %1 )]R81)% 3̂]2I 3XI % I4+ 70. X/ 0)04 + %1 1 76& cI1 ) 61 70% ̂Bode 76& 0_% `

    301 Moved Permanently %1 )]RX1% ̂3]2I 3XI g1 %& 7]1) .Z1%& ]4I4+ 3 0()%4+ 701 )\ p81) cI1 ) 61 70% 3̂]_*R 4 )0_% ` B! ent I .1I %& I+ Ke uest X40 Z 701 ) \ p* 1)% ̂ KL . ^

    Ke uest X40 * cI1 ) 3*+ 0)7] )X/ )76& 0_% `

    304 Not Modified %1 )]RX1% 3̂]2I 3XI g1 Ke uest Header 1 kfFMod f edFS n=e ]2I . 3̂% 0_Y X1% ẐI & ^ .1I 04+ ) Ser#er 0i 13 701 )3X ^ U+ *) cI1 ) 61 7064 +*R 4 )0_% `

    307 Temporary Redirect %1 )]RX1% 3̂]2I 3XI g1 37]1)%& .Z1I4+ 1 ( \ p 701 )81)cI1 ) 61 70% 3̂]_*R 4 )0_% ` £‚ . Î 1% 3̂]2I I %& ]2+. 170. X/ Z1I U+ X1 176& X4 + .1I Ke uest% I4+ 3]4XI U+ KL 3%4+ ) [I XI [1 \ I 4+ cI1 ) 3*+ 0)% *̂ 176& 0_% `

    403 Forbidden Ke uest I4+ XI ]RZU+ 0 B! ent g1 3]2I 3XI Z 04+ ] U+ * g4 % % 3̂% I 70. X/ 0)04 + 1 g4% cI1 ) 61 707] )76& 0_% `

    404 Not Fo nd %1 )]RX1% ̂3]2I 3XI I Ser#er 1 U+ . cI1 ) 61 707] )76& 0_% `

    !00 "nternal #erver $rror / */ 3 cI1 ) cI1 . ) 3%+3I2 *+Z% ̂Ser#er rror %& ]476& 0i .% 3̂% I 3]2I 3XI 70. X/ 0)04 + 4+ 1 g4% cI1 ) 61 70%10_`

    !03 #ervice %navailable 1 ( Ser#er rror %& ]4 76& .% 3̂% I 70. X/ 0)04 + 4+ *)cI1 ) 61 70% ̂Bode 76& 0_% ` 3 21)31)76 3*R 4 )v0* *+0 21) .% 3̂]2+. V Web Ser#er 1 ( "o:n.% 3̂]2+. % 1 61 70% ̂Bode 0_`

    37]1) Status Bode % 3 cI1 )I4+0_ 370/ 3&R 4 I4+ [I XI X X1X4+% [4+Z %1 W ; $ed a Z ̂L stof HTTP Status Bodes Art =!e 1 [I XI X X1 4+ 0_% `

    L!"ŽCtt$Ž}}en

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    23/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 22

    3]2I 3XI I4+70. X/ XI ]RZ Gro:ser I 0)04 +X1% ̂Kes$ond Header *% )04 +]2I 0i %/ 0()X4+30 *X4+ [I XI [1 \ I * 1) 176& 0_% ` '0 1 F Gro:ser % g1 Web Bontent %& ]4 I4+ XI ]RZU+ 0()Z .1 70. X/ 3*R 4)]2 4+ 31 *+ )[/ )81) X U+ 0_% ` Ba=Ce X40 % X4 + ]i0_% ` 70. X/

    0)04 +X1% ̂ Kes$ond Header 10_Y X1% ̂Mod f ed "ate . *̂ *+ )[/ )81)% ̂Ba=Ce 8 Î Bontent Z ^Mod f ed "ate + ) ' cI/ 0() I 17]1)7] ) U+ Z Ser#er I 70. 04 +%1I4+ &1 %1 0 ̂*+ )81)% ̂Bontent I4+

    61 70X4+I 4+ 0_% ` O(./ ). ̂3*R 4 )v0* I 08 %& I+ Z 81)6 )% ̂Bontent I4+ .1I %& I+ 80 RZ X4+% 3̂]_ 04+ 0()7 . 7 . [. [. ZU+ 1 76& 0_% `

    Gro:ser % g1 3 7]]R31)76 Text, HTML, k>a@e &% ̂Bontent 3]2 +I4+ 61 70 4+ 0 61 70 4+ % ^Bontent % X/ )U+ 0_% ` '0 1 F M =rosoft x=e! E !e %& ]4I4+ Web Gro:ser I 61 70 0) 4+ 1 g4% 0_ )` O( %1 Kes$ond Header 10_X1% ̂BontentFTy$e I4+X/ ) Gro:ser IcI/ 0_% ` * 61 70 4+ % ^Bontent 3 2 +)3&1) [4+Z 3*R 4 )v0* cI/ \ 4+ 31 61 70X4+I 10_` 61 70 4+ % ̂Bontent 3 2 +)3&1)[4+Z %1 3*R 4 )v0* Z 4+ 64 + "o:n!oad 0)X4+I 10 7̂6& 0_% `

    O(X4+ Ke uest}Kes$ond Header *% ) 0)04 +]2I % 370. 3X . 0)04 +7] )31)76 B! ent . ̂Ser#er g1%& 1I I4+%& 1I .1)X/ 0() [I * [1 \ I 4+ cI%10_` HTTP I %1 O(X4+ [I * [1 \ I Z1 1 X4+I .1Z 3[ % V 0_Y Z 3]2I 3XI % I4+ *% % 0)81)% ̂ Web Standard %& ]40 7̂6& 0_% `

    PI$$ ]eOb"o$oaTHTTP g1 Pu!! Te=Cno!o@y %& 2 +)76& 0_% ` Pu!! Te=Cno!o@y [4+%1 B! ent . ̂Ser#er [I * % ̂3]_ 1B! ent I*1 [I * I4+ '()[R 4 )&% % ̂./ )0/1I4+ ]i%176& 0_% ` Ser#er I B! ent [I * X1% ^3]_ *1 * %1 *X4+3 cI1 )70. 0)%10_` Pu!! Te=Cno!o@y 1 Ser#er I [I * %& ]4I4+ 3&v0% [4+%1 U+ 0_ )`

    -V 1 ( W ) HTTP 3X40 X40 0R 4

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    24/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 2

    O_g1X/ ) \4+)U ) 0 X X1& 1 *%+X % %I % 3̂]2I 76& 0_% ` KL g1 Web "e#e!o$>ent Z ^.R0_% q• 3 7]]R76& % [4+Z V B! ent Ke uest X40 0 ̂Ser#er Kes$ond [4+%1 U+ 1 g4% )[4+% ̂3]2I I .R0_% q€ 3 Z)3 I()[R 4) 3 7]]R3]2I 0 7̂6& 0_% `

    Pu!! Te=Cno!o@y g1 \4+)& )% 3̂% I Web A$$! =at on % Z)*1)Z7] )g1 %& 7]1) *1 Eu!!F"u$!ex X4 +]i% ̂B! entFSer#er & ]4&XR 4)I [I * 3&v0 4+ % ̂‰et:or; A$$! =at on % 6. %()Z7] )8I 04+ 4+

    X I 0_% ` O_ 0 %& ]_%& ZR Kea!FT >e A$$! =at on X4 + ]i% ̂&Im. X0 3]2I 3XI % 701 )X ^.64 + X4+30 % ̂ A$$! =at on % 3% I %1 O( Pu!! Te=Cno!o@y I 3I. 3*% 76& .%I 70. 0_% `

    O_I4+ 76U )64 + 3% I Lon@FPo!! n@, Web So=;ets &*76 ./ )X ) % U+ 0_% ` 3 Ô(./ )0/1 %3 cI1 )I4+ %1 ( ) S] Lg 1 [I XI 61 700_ `

    QJ#Je$e ProJoOo$State!ess Proto=o! [4+%1g1 B! ent . ̂Ser#er [I * %& I+ . %̂& I+ [I 7] ) U+ % ̂./ )0/1I4+]i%176& 0_% ` %./ )31)76 Ke uest}Kes$ond State I4+ 8+ )*+ )81)7] ) U+ )X4 + [4+X4+%10_` HTT

    g1 State!ess Proto=o! %& 2 +)76& 0_% ` B! ent I Kesour=e A I4+ %1 )]R [4+Z Ser#er IKesour=e A I4+ 0) 0_X+ ` B! ent I .1I %& I+ 3 .. ̂Kesour=e G I4+ %1 )]R [4+Z Ser#erI Kesour=e G I4+ 0) 10_0 ^̀ 08 3 I+ Kesour=e A 3% I X40 ] %̂ [̂I * . ̂ .1I %& I+ Kesour=e G 3% I 80 X40 Z% [̂I * %4 + cI1) 1 X4+[I &0 2 +) U+ % *̂ 176& 0_% ` A

    %1 )Z A I4+ 0)% V G %1 )Z G I4+ 0)% V ]0 U )U )0 3̂X40 X40 * 1)%10_`

    %& ]2 +76& . 8+ )*+ )81)64 +X4+% ̂ State % 3% I Boo; e, Sess on 3&U+ % .̂/ )0/1 % 3*R 4 )v0 4+ 0_% ` Boo; e . ̂Sess on 21) &( R0R 4 I4+ %1 ( ) PSP Y# !O 1 61 70 0)0_ ` O( .Z1 1 %1 HTTg1 * 1Y3Z Pu!! Te=Cno!o@y %& 2 +)76& 0() State!ess * 1YX/ ) U+ % [4+% 3̂]2I I4+ 38 )v0

    % *1)81) &]2 0_% `

    DAg K S]]PhCO(&1 Z)*1) .]2+. 8+ % % I2 I2 3*R 4 )v0 .% ̂ HTTP I4+ HTTP}‚

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    25/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    26/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q• Web Standards 25

    O(X40 [1 ]2I % cI1 HTTP} g1 HTTP}‚

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    27/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    28/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 27

    ( ) ST er]eMJ #r I L#"aI#ae W S]Se>ant = "ata Stru=ture qor TCe Koot of #erytC n@

    HTML g1 Web "o=u>ent % Z)*1)%/ [1I % 3̂]_ X4+I .164 + W B I *% % 0)81)% ^"o=u>ent Z)*1)0R 4 Z)*1)./ )0 7̂6& 0_% ` Web "o=u>ent %& ]4g1 HTML !e>ent % &4&/ )81)% ^Text "o=u>ent %& 2 +)0 7̂6& 0_% `

    -V 1 ( W ) HTML !e>ent %& ]4 6 ^ &/ )0R 4

    -V 1 ( W ) 1 HTML !e>ent %& ]4Z ̂6 ^ &/ )0R 4 I4+ 61 70 0)81)0_% ` HTML !e>ent % 1 $en Ta ^B!ose Ta@ [4+ 0() 36 30+% 3 % 3*1) 21)0_U+ Z0_% ` 3 Ô(36 30+% cI1)8 ^ 1 !e>ent Bontent%/ U+ Z 0() $en Ta@ 3% ) 1 Attr bute % U+ 4+ 0_% ` B!ose Ta@ . ̂ !e>ent Bontent U+ 0 ̂ $enTa@ . ̂Attr bute % *10_Y % ̂ >$ty Ta@ % X/ )U+ 0_ *)% `

    •‘‘• ]4 & I 3 Ô(X4+ !e>ent q•ƒ 2 +)0_Y % ̂"o=u>ent Z)*1)./ )I4+ HTML Hy$erText Mar;uLan@ua@e Z X4 + Wor!d W de Web ./ )0/1I4+%(8 ] %̂ ̂T > GernersFLee I0 ̂&% %(8 ] %̂10_` 3 Ô(q•ƒ ]48 Î q•• ]4g1 I .8+[I XI 0_Y 3*R 4)v0 .[ 7̂6& 0_% ` HTML

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    29/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 28

    0/1 21)0_Y X1% ̂HTML5 I4+ 3*R 4 )v0cI 176& 0 V O(3]. ) 1 %1 04+ 0()3 7]]RI2% ̂HTML ¤ent % I4+[4+X4+%1 0_% ` *% % &/ ) 2' ). 3̂/( &.& I2 31 %/ [1I 81) *1 Web "o=u>ent % g1 X %& 1I 6% \ .1)X/ 4+ R 4 I I . 02 %1IX/ ) Pro=ess X40 4+ 176& 0_% ` W B I HTML I4+ 6. %()% ^ .Z1 1X/ ) O(X4+Z/ \ ]2I . 0̂ ̂6. %()81)%176& 0_% `

    X %& 1I g1 Web "o=u>ent %& ]43% ) 1 1 % 0_X/ )*+]2 Z 2I &+. ĉI/ 0()6% \ X X1 10_`O_ 0 I . 02 %1I %1 3 Ô( "o=u>ent 8 ^ 1 1 % 0_X [̂4+%1*+Z64 + 3% I Pro=ess X40 0() .1)X/ Z %176& 0_% ` I . 02 %1[4+%1 Pro=ess n@ Po:er U+ 0 * 0)Z 1 %I %1 31)XR 4 )3*+0_` WebGro:ser, Sear=C n@ ne S$ der 3&U+ % Î . 02 %1 Soft:are % I4+ *% % &/ ) 2' ) % * 81) 0)% ^3% I Web "o=u>ent %& ]4 I4+ 6% % ^ .Z1 1 3 Ô(&/ ) 2' ) % . %̂4+I [4+ cI/ 0() .1)X/ Z%176& 0_% ` O_ cI1 Iz. %1 %4 +%/ [1I % ̂ Web "o=u>ent % g1 *% % &/ ) 2' ). ^ /(Z I . 02 %1I Pro=ess X40 4+ % ̂Se>ant = "o=u>ent 76& 1 g4% 0_ )`

    X X1& Web "e#e!o$er % g1 Web "o=u>ent % %/ [1I % 3̂]_ „X % 6% X4 +Z64 +„ I4+ 3†+I'()%/ %/ [1I cI X U+ 0_% ` Web "o=u>ent % I4+ I . 02 %1IX/ ) Pro=ess X40 4+ 64 +X4+% [4+% 3̂]2I I4+ *%+X % X21 %I cI0_% ` Web "o=u>ent %& ]4g1 Text "o=u>ent *176& X4 +&/ ) 2' ) % . ^ I4+I /( X/ ) X % 3% I %1 6% X4 +Z . 4+ 10_` O_ 0 3 Ô( "o=u>ent I4+ 3 7]]R 0(

    %1 Iz. %1 %4 +I%& 7]1) Pro=ess % X40 Z'() 10_` 3 7]]R76& % ̂"o=u>ent &.& I2] Ẑ |oo@!e X4+Sear=C n@ ne . ̂Web Gro:ser % I Iz. %1 %4 + "o=u>ent I4+ 370/ 3Y.1) X/ % ̂70™.1U+ 4+ *X4+VIz. %1 %4 +I4+ %4+ [I XI Z)*1)Z BSS . ̂ Sty!e % *% % 7] )V Da#aS=r $t . ̂ !e>ent %&( R]. ] ^ 7] ) I+&¥ % I4+ [1 \ I % 3̂]_ 3]I 3] ^ % . ̂ %Z 176& 0_% `

    O_ cI1 HTML . ̂0I *I Z Iz. %1 %4 +g1 I . 02 %1I.1)X/ 4+ % ̂ "ata Stru=ture %/ [1I .7] ) 76& % [4+% 3̂*+g1 08 '()[R 4 )X4+30 ]2I 0 7̂6& 0_% ` *0 Z0 X 0 31 X4+0R 4&R 61 70 V X % Z ^

    2I &+ 1 0*1O76& 31 X4+6. %() [4+% Î+&¥g1 HTML Z %̂1Y. g4% 0_ )` XI % 1X40 X4 +X/ )Z0_ )` O_g1 .1I 3]. ) 1 [I XI X X1 BSS X4 + ]i% ̂Sty!e Lan@ua@e Z ̂%1Y. 0 7̂6& 0_% `Se>ant = Web Z ̂3 Z)0_0R 4 I4+ 04+ 0() 0iX &64 + Gro:ser War . ̂ŸHTML 3 cI1 ) 8/ * ) 61 70X4+0_% `

    CAC K YroZ er %#r08 '()[R 4 ) Web Gro:ser 76& % ̂Mosa = I4+%(8 ] %̂ ̂Mar= Andreessen . ̂D > B!ar; %4 + & 1I g1‰BSA I 8 I 0() Mosa = Bo>>un =at ons [4+% ̂X40 . )%& ]4I4+ %/ 81 ] 0̂_% ` .1I 04+ ) 1‰ets=a$e Bo>>un =at ons Bor$orat on X4 +3 / 701 ) 0() ‰ets=a$e ‰a# @ator [4+% ̂Web Gro:ser I4+

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    30/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 29

    6. %()] ĉI0_% ` ‰ets=a$e ‰a# @ator Z ̂Jers on ‚ent %& ]4%/ )I4+0 ̂ & 2 +)] ^ 0() %/ [1I 0)Z X U+ 0_% ` knternet x$!orer3% I %& 2 +)V ‰ets=a$e 3% I %& 2 +) & 2 +)] ^ 0()%/ [1I Z% *̂ 176& 0_% ` %& ]_%& ZR Gro:ser%& ]4%/ ) 3% I Z/ \ %/ [1I 0() „%& 7]1) Gro:ser . ̂ cI/ Z„ X4 + *% % Z%1 % X/ ) U+ ] 0̂_% ` I . ]% X4+ Major Gro:ser q’ ]430_3Y 37]1) Gro:ser X) _)[ X1I U+ % ^ ]% 1*13 Ô(X4+76& . *)Z "e#e!o$er % 3% I %1 % )Z &̂Z10_0 ^̀

    O(X4+I+&¥ % 1% /( 31 ~+ 0) W B U+ . 0 X/ ) 3&04+ ) 1 W B Web Standard % I4+ *+U X4+I .1* 3 %1 X)./ )] 0̂_% ` •‘‘ƒ ]4 & Z1I % 3̂8+ knternet x$!orer . ̂‰ets=a$e %4 +Z ̂ ' ‡0+ Gro:ser War 31I 1 Web "e#e!o$>ent X1Ig16\4+6Z ̂76& .] Ẑ%10 7̂6& 0_% ` Web "e#e!o$er

    % 3% I Gro:ser War I%& 2 +)V 3 Ô( Gro:ser War cI1 76& 76& 31 6. %()Z% 3̂% I &.& I276& .% ̂Web "o=u>ent % I%& * . ̂]I ] %̂ Î1X % 0 7̂6& 0_% `

    •‘‘ƒ ]4 & 1 %1 Profess ona! Web "e#e!o$er % . 6̂ ^ &/ )81)% ̂ Web Standard Proje=t qWaSP [4+% ^36 ^ 3&/ )%& Z0 0i 0_I X1 0() Web Standard Z 3̂ Z)0_0R 4 I4+ 61 84% 701[4+X1] 0̂_% ` 3†+IZ/ \ ]2I I %1 M =rosoft . ̂‰ets=a$e %4 +3 .. ̂W B Web Standard 21)I4+ %+%+I2I2X4+I .1 31 % . )31) 0)64 +0 ̂ 76& 0_% ` WaSP Z ̂ Z)*1) 61 70 % g1 3 %1.I 13X- 37 . 70. R X1% 3̂% I Web "e#e!o$er % 30_ 3Y 3 %1.I 3*R 4 )v0* % 3 .. ̂Web Standard Z ̂3 Z)0_0R 4 I4+ 04+ 4+*+U .1)X/ X1] ĉI0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    31/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 0

    €——— 70/ & Z1I % 3̂]_ 1 M =rosoft I Ma= 3% I knternet x$!orer 5 I4+ cI7 1] 0̂_% ` 3 Ô(Gro:ser 1 Web Standard I4+ 3 %1 X)X4+I .1X1X4 + O_g13 Z)0_% Î1X%& ]4X4 +[4+ 4+ 0_% ` WaSPI ‰ets=a$e I4+X/ ) ‰a# @ator 5 I4+ 76. *)0 ̂Web Standard I4+ 3%4+ )3%1%& ]48+ X4+I .1 4+ 0([4+*176. 64 + 6+31) 0)] 0̂_% `

    %& ]2+. %/ ) 10 ̂W red, SP‰ 3&U+ % ̂Webs te % I& 0() * %4 + Webs te % I4+ Web Standard . ̂3/(701 )X ̂%/ [1I X1] ĉI0_% ` €——š ]4 & 1 %1 BSS ¦en |arden [4+% ̂Webs te %& ]4 0iX1

    ] ^ 0() HTML I4+ 8+&Z1 X4+0 ̂BSS I4+*R 4 ) 0() Webs te %& ]4XR 4)Z ̂"es @n I4+ 3 2 +) 2 +) 701 )X4 +Z cI1 )XI % 70*X1] 0̂_% ` Web "e#e!o$er % 38 )&+% Y &1)cI 0() O_g1 Web "es @n X1I%& ]% [. ) &] %̂ ̂6. %() X/ ) 76& ] 0̂_% `

    €——” ]4 & I4+ Z1I X1% 3̂]_ Web Standard I4+ I1 ) I1 )X4+I .181)% ̂MoN !!a E refox Z ̂08 [R 4 )Jers on 8 I X1] 0̂_% ` 3 Ô( & 8 ^ 10 ̂|oo@!e I |>a ! I4+ &% cI7 1] 0̂_% ` |>a ! g1 WebStandard %& ]476& % ̂Da#aS=r $t . ̂" M I4+ 3†+I3*R 4 )v0 0() %/ [1I 81)7] )76& 0_% ` 3[ 7 A$$! =at on % I4+ Da#aS=r $t . ̂O(X4+ %/ [1I 4+ 0_X1)X4 + Web "e#e!o$er % 3% I &R. .1 &Z1A$$! =at on %& ]4 76& X1] 0̂_% ` €——” ]4 & & I4 . 04+ ) X1I 1 %1 §Ke !!y Med a I T >F §KWeb

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    32/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 1

    HTML ent % 3 %1 21)X1] ^ 0(76& 0_% ` O(X4+8/ * ) 0)X4+I % 3̂% I HTML Z ̂ XZ/ \ ]2I I4+X/ ) %& 76/ )76/ )8+]4+I X10_% ` HTML [4+%1g1 Se>ant = "ata Stru=ture %/ [1I 64 +[4+% ^\ O_ I . 37 X % ̂"o=u>ent % %/ [1I 64 +3% I [4+% ^ I I4+ '()%/ X1% *̂ 176& 0_% `

    HTML ¤ent [4+%1g1Web A$$! =at on % Z 3̂ 7]]R "ata Stru=ture g4% %1 0 ̂Eont 3 2 +) 2 +)V &1XR 4)3 Z1 3 2 +) 2 +). ̂TextEor>at X40 81)% ̂"o=u>ent *1*1 76& X10_ %1 % ` Gro:ser Su$$ort 31)./ ) g1 3†+I3]2I 76& 0 O(X4+X ^ 1)% 3̂ 7]]R Bon=e$t % g1X/ ) 3 Ô(I1X % 1 3[ 7 Web A$$! =at on Z X4 +

    7010 X1I 31 0i8 I X17] ) 3 cI1 )Z )%& ]476& 0_% `

    W B 3 .. 3̂ 7]3 . % I4+8+ )~+ 64 + 76& .X4+30 X10_% ` O_ 0 HTML ¤ent % I4+ .1I Jers on 1 70. v6% 70& X4 + %1 Z0_ )` XI U+ HTML ¤$at b ! ty I4+ 8+]4+I 10 7̂6& 0_% ` O_ cI1 W B I HTML I4+ 70 %1 0 ̂ŸHTML X4 + ]i% *̂()7]1) Mar;u$ Lan@ua@e %& ]4I4+ €———70/ & . .Y_Z(X 1 cI7 1] 0̂_% ` ŸHTML 1 0_% ̂Ÿ g1 eŸtens b!e [4+% 3̂†+0˜_ 76& 0_% ` W BI0 ̂%(8 81)% ̂"ata Mode! Lan@ua@e 76& % ̂ŸML Z)*1)0R 4 3%4+ ) Z)*1)Z 176& 0() 04+ 0()&.& I2% ^HTML X4 +X/ ) [4+ 4+ 0_% `

    HTML 18/ * )81)% ̂Se>ant = 76& % ̂ !e>ent % I4+ ŸHTML 1 v6% 840 70& ] ^ 0() &/ ) 2' )&/ )I ) % I4+X/ ) 04+ 4+% )cI0 X4+I 0_% ` '0 1 F ŸHTML 1 !e>ent Ta@ % 31)XR 4 )I4+ &1XR 4) *). 0̂ ^ Z)Z X4 + *% % 0_% ` HTML 1 %1 &1XR 4)3 I()3 *) & *I Z1. ̂ Z)X4 +Z*X4+ 3 2 +) 2 +)X/ ) Z)cI0_% ` ŸHTML 1 !e>ent %4+ )3% I B!ose Ta@ 0_Y Z X4 +*% % 0_% ` B!ose Ta@ U+ % ^

    >$ty !e>ent % I4+X/ ) Se!fFB!os n@ !e>ent 376& 61 70*% % Z X4 + *% % 0_% q'0 1 F9*r / 9img / ` Attr bute Ja!ue %4+ )I4+X/ ) Quote 3% )8 ^ 1 8/ * )Z X4 +*% % 0_% `&*76 37]1)*% % ]2I % X/ ) U+ 0_ *)% ` X4+Z )I %1 ŸHTML g1 HTML 1 1)] %̂ 3̂ 1)

    % I4+ v070 6 840 0() Se>ant = "o=u>ent % %/ [1I 64 +3% I Z/ \ 6. %()X4+I % ^ Mar;u$Lan@ua@e %& 2 +)0 7̂6& 0_% `

    WaSP Z ̂'() [1 . ̂Web Standard X 0 U 1) % v0X40 .&' 1 Web "e#e!o$er % g1 ŸHTML I4Web "o=u>ent % %/ [1I 64 +3*R 4 )v0] ĉI 0() 37]1) "e#e!o$er % I4+X/ ) ŸHTML I4+*1 3*R 4 )v064 +31) 0) % v0X40 ] ĉI0_% `

    WaSP X 0 U 1) . ̂ŸHTML g1 Se>ant = Web "o=u>ent . ̂Gro:ser % Z ̂Web Standard Su$$ort I4+21)& 1 *I Z1I U+ ] %̂10 7̂6& 0_% ` % % I2 I2 3*R 4 )v0] %̂ ̂ŸHTML g1 Jers on ‚

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    33/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 2

    HTML5 1 Z/ \ ]2I I1 ) % U+ ] %̂ ̂ŸHTML *% % ]2I % I4+ 0_ )&0 8/ * )81) 0() X HTML¤$at b!e 76& 31 &( R81)0_% ` HTML53 cI1 ) 701&Z1 21)& 1U+ % 3̂% I O( .Z1 13I2 ]2 ^ %1 0_ )` ( ) Z1I *1 *()7]1)80 R[ ) ) 176& 0_% ` 3]4 %1 Iz. %1 %4 +*+64 +X4+% ̂ HTML !e>ent %& ]2 +I4+ [I XI X X1* 1)]2 0_% `

    CA\ K S] LHTML "o=u>ent %& ]4 76& 7 1I 64 +3% I 3./ )[R 4 )X4+30 ]2I I %1 "o=u>ent Ty$e "e=!arat on 0 ^76& 0_% ` O(%& ]40_Z HTML "o=u>ent X4 +[4+ 4+ 0_ 0(` O_ 0 X/ ) 70/ &R 4 % ̂ HTML "o=u>ent %& ]4g13./ )[R 4 ) %1 31I 61 700_ !e>ent % 0_Y * 0_% F

    &'doctype (tml) 9html

    9hea"9title oc&ment Title9/title

    9/hea"9*o"6

    9;-- oc&ment 5ontent --9/*o"6

    9/html

    08 [R 4 )X4+ ) 9;"oct6pe html [4+%1I O( "o=u>ent g1 HTML "o=u>ent %& ]476& cI1 ) cI7 1X4+I % ̂"o=u>ent Ty$e "e=!arat on 0 ̂76& 0_% ` I2. HTML !e>ents 31)XR 4 )I4+9html !e>ent3% ) 1 [I XI Z)*1)Z 10_`9html !e>ent 3% ) 1 3†+I !e>ent & ]4*1U+ 0_% ` 9hea"

    !e>ent . ̂9*o"6 !e>ent %4 +0 7̂6& 0_% `

    9hea" !e>ent g1 XI U+ "o=u>ent . *̂I [4+ % ̂3]2I 3XI % cI7 164 +3*R 4 )v0Z0_% ` * 8 ^ 10R 4 . 31)76 9title !e>ent %& ]4 0_Y * 0_% ` 9title !e>ent 3% ) 1 "o=u>ent T t!e3 .. ̂3*R 4 )v0X4+% ^ ]_ )&' I4+ 8/ * ) 0)Z 10_`9hea" !e>ent 3% ) 1 8/ * ) X U+ % ̂37]1)

    !e>ent % I %19meta 9lin< 9script 9st6le %4 +0 7̂6& 0_% `

    9*o"6 !e>ent 3% ) 1 %1 Web Gro:ser 1 Bontent 3 .. ̂ 61 70 &X4+% ̂ 3]2I 3XI %8/ * ) Z)*1)Z 10_` . .1 1 3*R 4 )v081)% ̂9;-- -- !e>ent I %1 % ]2I % 8/ * )64 +3*R 4 )v0 4+ % ̂Bo>>ent !e>ent 76& 0_% ` Bo>>ent !e>ent 8 ^ 1 Z)*1)81)% ̂3]2I 3XI % g1"o=u>ent %/ [1I * Z ̂ % ]2I 21)*176& 0() 8/ * ) 61 70 1 g4% % ̂3]2I 3XI 21)76& 0_% `

    4 * d d HTML !e>ent % &4&/ ) Z)*1)81)% ̂Web "o=u>ent % I4+ E !e Syste> 1 *+ )[/ )% 3̂]_ Ct>!xtens on q'0 1 F Co>e! . ̂*+ )[/ )Z0_% ` "o=u>ent %& ]4g1 Web "o=u>ent 76& cI1 ) I . 02 %1I4+

    3*+ 0)64 + xtens on I 3†+I %1 I20_ )` BontentFTy$e X4 + ]i% ̂ E !e Attr bute I*1 3†+I76& 0_% ` O_I4+8/ * ) 701Z%1I Web "o=u>ent %4+ ) Ct>! xtens on U+ Z X4 + 0R 4 * [ &]2 X4 +76& 0_% ` 4 231)76

    . 0 Ct>! xtens on 0)81)% ̂Web "o=u>ent % X/ ) U+ 4+ 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    34/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML

    Y# !O `$eUe"J%& 7]1)\ 0 8 )% ̂X40 [1 ]2I % I4+ ] 81) 0() HTML "o=u>ent %& ]4I4+ Iz. %1 %4 + &1\ I % . ^

    % 7 .cI Text "o=u>ent % . ̂ + ) ' cI/ Z 31 0_` Text "o=u>ent % 1 0R 4 . 31)76 ]_ )&()% 0_ V &104+O % 0_ V &1Z ) % 0_ V 1) % 0_ V Z)*1)76/ * ) 4+ % ̂Eor> % 0_Y 176&

    0_% ` 76/ & I 0_Y 4+ %1 % I %1 0R 4 % . ̂Hy$er! n; ]i 37]1) "o=u>ent % I4+]2+% [I 4+ % ^L n; % 0 ̂76& 0_% `

    ]_ )&()[4+% ^ .Z1 1 3[ X4+I ]_ )&()3 2 +) 2 +)U+ 4+ 0_% ` "o=u>ent %& ]4 1 Ma n Head n@ X4 + ]i% ^3†+I ]_ )&()U+ 4+ *X4+ *I [4+ Z1Iˆ%& ]4 &( 1 80 [ ] ^ 0)81)% ̂Sub Head n@ ]i ]_ )&' ] ^ %U+ 4+ 0_% ` HTML "o=u>ent %& ]4 1 ]_ )&(). ^ ]_ )&' ] ^ q– [ 8/ X4 +Z0_% ` Ma n Head n@ 3% I 9h1 !e>ent I4+*R 4 )Z0_% ` 08 3[ ]_ )&' ] ^ 3% I 9h' !e>ent I4+ *R 4 )Z0_% ` O4%+ 3[ 3% I ]_ )&' ] ^ I4+ %19h+ !e>ent I4+ 3*R 4 )v0Z 0()9h, 9h 9h( &*76 &4&4 0_ ) q– [ ] ^ 7]1)3*R 4 )v0 4+ 0_% ` I4+ %/ [1I .% ^ "o=u>ent * 1Y. Î4+I /( 31 *I [4+ Z1 ]_ )&()V

    ]_ )&' ] ^ %4 +I4+ \ )]2 3*R 4)v0Z 10 7̂6& 0_% `

    &104+O % 8/ * ) 61 7064 +3% I 9p !e>ent I4+ 3*R 4 )v0Z0_% ` ]_ )&' % . &̂104+O % 0_Y % ̂ HTML"o=u>ent %& ]4g1 3]4X4+ 76& 4+ 0_% `

    9;"oct6pe html9html

    9hea"9meta charset8=UT)-0=9title ~4+7 F &1 Z)[Z19/title

    9/hea" 9*o"6 9h1 &1 Z)[Z1 I() '()~4+79/h1 9img *rc+,nyomya-.if, alt8= '()~4+7 0R 4= 9p

    R 4 \ 1]\4+ ]21 )'()‡+. 37 ‡+ *1%10. \ 1© 36 )%4+ 0 3 % %(0(3I & ^ Z 3 +. %1 ZU . '()*1 RV 3 + Oi3 R q Oi \p3 R %4 +I •‘•” ]4 & › 0(X •Y ZI *1cI1 .% )6 1)*/ `

    3 / Z ) '()*+. )% 76& *1 X/ ) I X1 3 / ~4+7 */ 0 3 / Z ) I *̂4 + % */ `9/p9p

    \pI \ 1 [Z1X+ X%. ) I21 )V cII * . ª)\ 1 [Z1 %1 '()«1 I21 )%4 +% &% 0/1 * ] ^ ` •‘šš ]4 & % Z. I4 . %Im*4+X © [I XI 0/1 * */ ` •‘šƒ ]4 & % Y+ ¬1 q3w… X+0 &1 w4 8 )%. ) ^ Z] *̂/ ` •‘”š ]4 & % g1 *+0R˜ q*% )&1 0/1 ^ Z] *̂/ `

    9/p9h' Y.+wR 4 )9/h'9p

    •‘ƒ’ ]4 & &I % 1X €‘ ZI . / . – .1Z( šY +.& % Z. I4 . [)\R 4 I()© I X . ] *̂/ `9/p

    9/*o"69/html

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    35/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML

    . .1I4+ X X1cI/ [4+Z 9hea" !e>ent 3% ) 19meta !e>ent %& ]4 76/ & I 0_Y X1%1I4+ %Z0_ ` O( !e>ent IXI U+ "o=u>ent 8 ^ 10_Y % ̂Bontent % I4+ 61 7064 + TEF¢ n=od n@I4+ 3*R 4 )v0Z X4 + cI7 1X4+I %10 7̂6& 0_% ` O(X4+*% % 0)81) *1 n@! sC g4% % ̂&1 21)I4+ . I.

    31 61 70 0) 4+ 1 76& 0_ `

    9*o"6 !e>ent 3% ) 1 3†+I ]_ )&' 376& 3*R 4 )]2X4+% ̂9h1 !e>ent %& ]40_Y 0() ]_ )&' ] ^ 376& 61 70X4+% ̂9h' !e>ent %& ]4%4 +0_Y %1I4+X/ )*%+v0 + 10_` 8/ * )X4+% ̂ &104+O I %1 qš 04+O

    76& % 3̂% I 9p !e>ent *R 4 )]4 3*R 4 )v081)%1I4+ %Z 4+ 0_% `

    8 )7]1)]2I 3 .. ̂9img !e>ent %& ]4 I4+X/ ) 3*R 4 )v081)0_% ` 9img !e>ent I4+ 0R 4 % 8/ * )X4+% ̂3]_3*R 4 )v0Z0_% ` >$ty !e>ent %& ]476& 0() * 1 B!ose Ta@ . ̂Ta@ Bontent 0_Y 0_ )`

    O_ 0 % ^ 6I 3*R 4 )v0Z% ̂Attr bute & ]4U+ 0_% ` src Attr bute I4+ 0R 4%/ U+ % ̂PatC I4+ ~ . 70 0)64 +3*R 4 )v0Z0_% ` alt Attr bute I4+ %1 0R 4 61 70 4+ % ̂3 7]3 . % 1 0R 43&1) 61 70 &X4+% &̂1 8/ * )0)64 +*R 4 )Z0_% ` 0R 4 61 70 4+ % 3̂ 7]3 .[4+%1src 1 0)81)% ̂PatC X ^ 1) .%10 7̂6& 76& V 3 %1.I

    3[I 3* 3]I 3] ^ cI1 61 70 4+ %10 7̂6& 76& 3 7]3 .%& Z0 Z0 cI1 0R 4 61 70 4+ % ̂3 7]3 .I4+[4+X4+%10_` Z)*1)81)% ̂. .1I4+n6om6a.html E !e ‰a>e . ̂I ) *+ )[/ ) 0() Web Gro:ser . ^6 X & cI/ \ [4+Z 3]4X4+ % 7 Z 10 7̂6& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    36/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 5

    9h1 !e>ent 3*R 4 )v081)% ̂3†+I ]_ )&()I4+ &1XR 4)]0 I() I(). ^ %Z 176& 0() %19h' !e>ent 3*R 4 )v081)% ̂ ]_ )&' ] ^ I %1 3./ ) *)%1I4+ %Z 176& 0_% ` O_ 0 O( .Z1 1 80 R*%+ 0)]2 %1I %1 Iz. %1 %4 +I "o=u>ent Stru=ture %/ [1I .7] ) 76& 0_% ` Gro:ser I 3[ 70 31

    61 70 0) . 0 &1XR 4) I()]2 X4 +9h1 !e>ent *R 4 )%1 g4% 0_ )` 3†+I ]_ )&() 4 +9h1 *R 4 )%10_`3./ ) 0 ^ I()]2 X4 +9h' *R 4 )%1 g4% 0_ )V ]_ )&' ] ^ 4 +9h' *R 4 )%176& 0_% `

    XI % 1 Gro:ser I 3X4+3 X-1I 61 70 0) .% ̂S Ne I 3*R 4 ) Y 0_ )` Iz. %1 %4 +X4+]2 % ̂S Ne . ^Sty!e 3%+3I2Z 31 BSS . ̂ 76& .70 [ Z'() 10_` O_ cI1 HTML Z)*1)]2+. 1 „ X4+ 0i

    X „̂ [4+%1I4+ &' )&1)* 0_ )` X4+3]2I 3XI X ̂ [4+%1I4+*1&' )&1) 0() * %1 % ̂ !e>ent . ^3*R 4 )v0 0)Z 10 7̂6& 0_% `

    4 * d d HTML "o=u>ent I4+ Z)*1)% 3̂]_ 1 8/ * )81)% ̂WC te S$a=e % I4+ 3X40 X40 % 3̂]_ 8/ * )&' )&1) 1 g4% 0_ )` WC te s$a=e [4+%1 „S$a=e„ „Tab„ . ̂„‰e: L ne„ %4 +3% I 3*R 4)v081)% ̂ .Z1X % % I4+701%10_` HTML "o=u>ent I4+ I . 02 %1I Pro=ess X40 % 3̂]_ 10 ̂76& 76& V Web Gro:ser I 61 70% ^ .Z1 10 ^

    76& 76& WC te S$a=e % 3&1) S n@!e S$a=e . *̂1 3&1)84+) 0()3X40 X40 * 1) 176& 0_% ` O_ cI1 Iz. %1 %4 +"o=u>ent 8 ^ 1 WC te S$a=e % I4+ & *I *X4+ 8/ * ) Z)*1) 4+ 0_% `

    4 * d d O(&1340 1 61 70% ̂. .1 % I4+e >aun@}$:dFr=} 1 3]. )&' 3%4+ ) 8/ 0)81)0_% ` . .1 %I4+ I4+ %4+ I ) & )*0 4+ Z %1 3 I1 )[R 4)0_0 ^̀ XI % Z)76& * 1) %1 04+ % + &0_% ` Z)*1)% ̂ .Z1 1

    & *I Z1 Text d tor I4+ 3*R 4)v0 Z)*1) 4+ 0_% ` O_ 0 ‰ote$ad X4+ d tor 2 +). ^ %1 *+0 3[ 700_ )`3 7]]R X40 [1 ]2I % 76& % ̂ L ne ‰u>ber, Syntax H @C! @Ct, Auto kndent 3&U+ % ̂X40 [1 ]2I % 0_Y % ̂Text

    d tor %& ]4 ]4 I4+ 3*R 4)v0* 0_% ` '0 1 Sub! >e Text qsub! >etext, ‰ote$ad qnote$adF$!usF$!usent . ̂Kesour=e %4+ )3% I I4+ 04+ X+0 &1 KL

    %& ]4&(U+ cI% X4 + 61 70] 0̂_% ` HTML "o=u>ent % Z ̂3†+I8 )7]1)]2I I %1 3 Ô( KL X+0 &1 % I4+3*R 4 )v0 0() "o=u>ent %& ]4 I . 37]1) "o=u>ent % I4+ Hy$er! n; % . ]̂2+% [I 4+ 7] )0 ̂76& 0_% `

    3 Ô(370 "o=u>ent %& ]4Z 3̂% )8 Î 3&+% 304+ )%& ]4I . 37]1)3&+% 304+ )%& ]4 I4+X/ ) ]2+% [I 4+ 0_ *)% ` 70 0 "o=u>ent %& ]4. ]̂2+% [I 81)% ̂L n; I4+ Hy$er! n; ]i 0() XI U+ "o=u>ent 8 Î0 ^

    37]1)3&+% 304+ )%& ]4 I4+]2+% [I 81)% ̂L n; I4+ %1 An=Cor X4 + ]i X U+ 0_% ` %./ ) 701Z [4+Z L n; % 1 70 0 Kesour=e %& ]4 I4+Z/ ~ . )]2+% [I 4+ % ̂ xterna! L n; . ̂XI U+ "o=u>ent 3% )3&+% 304+ )%& ]4 I4+ Z/ ~ . )]2+% [I 4+ % ̂knterna! L n; [4+ 0() & 2 +)U+ % ̂* 176& 0_% `

    xterna! L n; 8/ * )]2 Z 9a !e>ent I4+ 3*R 4 )v0Z 0() knterna! L n; 8/ * )]2 Z X/ ) 9a!e>ent I4+0 ̂3*R 4 )v0Z0_% ` 9a !e>ent %4+ ) 1href [4+% ̂X+0 &1 KL 8/ * )64 + 3% I Attr bute

    %& ]4 76& .0_Y Z0_% ` |oo@!e Sear=C I4+ ]2+% [I 81)% ̂ xterna! L n; %& ]4I4+ 3]4X4+8/ * )4+ 0_% `

    http://eimaung.com/pwd-rc/http://sublimetext.com/http://notepad-plus-plus.org/http://eimaung.com/pwd-rc/http://sublimetext.com/http://notepad-plus-plus.org/

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    37/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    38/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 7

    "o=u>ent 1 %& 7]1) ®C ¯ !e>ent % X/ ) U+ 4+ 0_ *)% ` O_ 0 O( ®C ¯ I %1 * 21). ^ % 0 ^I4+ 04+ k" %& ]4U+ * 1) 0(76& 0_% `

    ®a¯ !e>ent I4+ 3*R 4 )v0 0() XI U+ "o=u>ent 8 Î0 ̂ .Z1%& ]4I4+ 3%+3I2 ~ . )[4+]2+% [I X4+Z k" I4+~p. ) 0() ]2+% [I Z%10_% ` '0 1 F

    9a (ref+, c(2, 5hapter T>o9/a

    O( ®a¯ !e>ent Z ̂Cref Attr bute 1 "o=u>ent %& ]4 I4+Z/ ~ . )81)%1 g4% 0 ̂XI U+ "o=u>ent 8 Î0 ^=C [4+% ̂k" U+ % ̂ !e>ent I4+Z/ ~ . )X4+I %176& 0_% ` ²=C X4 + U 1 ² S @n X) 8/ * ) 0)Z%1I4+

    *%+v00_`xterna! L n; % 1X/ ) 70 0 "o=u>ent %& ]4I4+~ . )[4+ R 4 I 3 Ô( "o=u>ent 8 Î !e>ent %& ]4I4+

    %4+I \4+I ~p. )[4+X4+Z X/ ) O(./ )3%4+ )0 3̂*R 4 )v0 4+ 0_% ` '0 1 F

    9a href8=http://example.com/toc.html c(2 = 5hapter T>o9/a

    . .1 1 exa>$!e}to=! I4+ ~ . )[4+ R 4 I 3 Ô( "o=u>ent 8 Î ²=C [4+% ̂ !e>ent 8+ 3%+3I2~ . )[4+8/ * ) 0)X4+I %10 ̂76& 0_% `

    L! JHTML "o=u>ent %& ]4 1 &1Z )3 .. ̂ 61 70% ̂L st % 8/ * )64 +3% I !e>ent & ]4 U+ 0_% ` 9&l. ̂9ol 76& 0_% ` 9&l [4+%1 nordered L st [4+% 3̂†+0˜_ 76& 0() &1Z )I4+ Gu!!et X) % . ̂ 61 70 0)

    1 76& 0_% ` 9ol I %1 rdered L st [4+% 3̂†+0˜_ 76& 0() &1Z )I4+ .R0_% &' . ̂ 61 70 0) 10 7̂6& 0_% `

    O( .Z1 1X ̂I4+ 8/ * )% ̂L st I 3&(3&' I2. 0()*1) &1Z )[4+Z 9ol I4+ 3*R 4 )v0* 0() 3&(3&' I2.% ̂&1Z ) g4% Z 9&l I4+ *R 4)* %176& 0_% ` 3]2I 3XI 3 2 +)3&1). ̂I4+I /( 31 3*R 4 )v0Z %176& 0() 61 70 0R 4 I4+cI/ 0() \ )]2 3*R 4 )v0Z%1 g4% 0_ )` Gu!!et . ̂ 61 70% V .R0_% &' . ^ 61 70% [4+% ̂370 3[ I .1I X4+*X4+ 701 )X ^ X4 +Z0_% `

    9&l 9ol !e>ent % 3% )8 ^ 1 0_Y Z kte> &1Z )I4+ %1 L st kte> !e>ent 76& % ̂9li!e>ent 3*R 4 )v08/ * ) 0)Z 10 ̂76& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    39/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 8

    7 ? -V 1 <

    9ol 9li 5hapter ne9/li 9li 5hapter T>o9/li 9li 5hapter Three9/li 9li 5hapter )o&r9/li9/ol

    7=0

    ‚< BCa$ter ne< BCa$ter T:o< BCa$ter TCree

    ¤< BCa$ter Eour

    7 ? -V 1 <

    9&l 9li @angon9/li 9li Man"ala69/li 9li a6p6i"a>9/li 9li Mon6>a9/li9/&l

    7=0

    Œan@on• Manda!ay• ‰ay$y da:• Mony:a

    9ol !e>ent I4+ 3*R 4 )v0% ̂L st %& ]4 1 & % I4+ *% % 0)]2 Z start Attr bute 3*R 4 )v0 4+ 0_% `'0 1 F9ol start8= = [4+Z .R0_% &' 61 70% 3̂]_ ‚ I & ̂5, ³, ´ &*76 61 70 0) * 1) 176& 0_% `

    %& ]_%& ZR &1Z )I3&(3&' %I2 %1 3&(3&' %I20 V̂ O_ 0 3&(3&' I 701 )70. q I()&' X4+I &(&' ]2 %1 2 +)X/ )U+ %I 0_% ` 3 Ô(X4+[4+Z %1re erse" Attr bute I4+ 3*R 4 )v0 4+ 0_% ` '0 1 F

    9ol re erse"

    4 * d d %& ]2 + !e>ent Attr bute % 1 Attr bute ‰a>e 0 0̂_ 0() Ja!ue 0_% ̂Attr bute % U+ 0_% ` 3 Ô(X4+Attr bute % I4+%& 7]1) Attr bute % Z)*1)0R 4 . ̂%& /(%/ )76& &]2 Z Attr bute ‰a>e I4+0 ̂Ja!ue 376& 3*R 4 ) v0

    Z)*1) 4+ 0_% V '0 1 F9ol re erse"8=re erse"= ` ŸHTML ]% I O(X4+370/ 3&R 4 Z)%1I4+ 31) 0)] ĉI0 3]4 .1I 04+ ) 1 %1 Z)*1)Z%4+% ̂Ja!ue 0_0 ̂Attr bute ‰a>e *I *I Z)*1)% ̂ Z)./ )I4+ 31) 0)X1

    cI70. 0_% ` & *I *X4+ Z)*1) 4+ 0_% `

    ]#&$e1) % 8/ * )64 +3% I 9ta*le !e>ent I4+ 3*R 4 )v0 4+ 0_% ` 1)%& ]4g1 Ko:s % Bo!u>ns

    % . ̂6 ^ &/ )81)%1 4 + Tab!e %& ]48/ * ) [4+Z Ko:s % Bo!u>ns % 0_ *% % 8/ * ) 0)Z 176& 0_% ` Ko:s % 8/ * )64 +3% I Tab!e Ko:9tr Attr bute *R 4 )Z 176& 0() Ko:s %& ]4&( 1

    0_Y % ̂Bo!u>ns % I4+ Tab!e "ata9t" Attr bute . ̂*% % 0)Z 176& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    40/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 9

    7 ? -V 1 <9ta*le 9tr 9t" ,0,9/t" 9t" MB9/t" 9t" MEB9/t" 9t" Mexico9/t" 9/tr 9tr 9t" !,9/t" 9t" MA9/t" 9t" MAC9/t" 9t" Morocco9/t" 9/tr

    9tr 9t" 1!,9/t" 9t" MM9/t" 9t" MMC9/t" 9t" M6anmar9/t" 9/tr 9tr 9t" ',9/t" 9t" P9/t" 9t" P49/t" 9t" epal9/t" 9/tr9/ta*le

    7=0 ¤¢¤ MŸ M Ÿ Mex =o5£¤ MA MAK Moro==o‚£¤ MM MMK Myan>ar5 ¤ ‰P ‰PL ‰e$a!

    Tab!e 3% I ]_ )&()8/ * )]2 Z %1 ]_ )&()376& 61 70X4+% ̂Bo!u>n 19t" !e>ent 3&1)9th !e>ent . ̂ 701 )X 3̂*R 4 )v0 0)Z 176& 0_% `

    7 ? -V 1 <9ta*le 9tr &t() 5o"e & t() &t() $% & t() &t() $% + & t() &t() ame & t() 9/tr

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    41/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 0

    9tr 9t" !,9/t"

    9t" MA9/t" 9t" MAC9/t" 9t" Morocco9/t" 9/tr 9tr 9t" 1!,9/t" 9t" MM9/t" 9t" MMC9/t" 9t" M6anmar9/t" 9/tr9/ta*le

    7=0 [oRe mQi mQiX n#Ue

    5£¤ MA MAK Moro==o‚£¤ MM MMK Myan>ar

    Tab!e I4+9thea" 9t*o"6 9tfoot !e>ent % *R 4 ) 0() %1 304+ )X4+I X/ ) ] ^ 7]1)*% % X4 +Z 0_% `

    7 ? -V 1 <9ta*le &t(ead) 9tr 9th col*pan+,4, 5o&ntr6 4ist9/th 9/tr & t(ead) &tbody) 9tr 9th 5o"e9/th 9th $% 9/th 9th $% +9/th

    9th ame9/th 9/tr 9tr 9t" !,9/t" 9t" MA9/t" 9t" MAC9/t" 9t" Morocco9/t" 9/tr 9tr 9t" 1!,9/t" 9t" MM9/t" 9t" MMC9/t" 9t" M6anmar9/t" 9/tr

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    42/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 1

    & tbody) 9tfoot

    9tr 9t" col*pan+,4, 5copy6 5op6right '!1+9/t" 9/tr & tfoot) 9/ta*le

    7=0 [oI"JrT L! J

    [oRe mQi mQiX n#Ue

    5£¤ MA MAK Moro==o‚£¤ MM MMK Myan>ar Bo$yr @Ct £‚©

    9thea" !e>ent 8 Î 9t" 1colspan8=,= [4+% ̂Attr bute %& ]4*R 4 )81)%1I4+ *%+v00_` 3 Ô(Attr bute I Bo!u>n % I4+ 0_ )&0 .Z1 &X4+% 3̂]_ 3*R 4 )v00_% ` colspan8=,= Z ̂3†+0˜_ IO( .Z1 1 „ X)I I &1 .Z1 0_„ X4 + 701X4+I *X4+0_0 ^̀ O_ cI1 ZXO 1cI/ X4+I Z X/ ) Bountry L st[4+% ̂Bo!u>n I X)I I &1 .Z1 0() 61 70 0)%1I4+ %Z 10_`

    9tfoot !e>ent 8 ^ 1Dcop67 [4+% ̂ Z)*1) %& ]4 I4+X/ ) *%+v00_` 3 Ô_I %1 HTML nt t!Sy>bo! X4 + ]i% ̂8 )7]1)% *̂ I… % % 8/ * )X4+% 3̂]_ 3*R 4 )v0Z% ̂ Z)*1)./ )76& 0_% ` A>$ersandq . 3̂&v0 0() Se> FBo!on qµ . ̂ 3[R 4)*% X U+ 0_% ` Dcop67 I %1 Sy>bo!© X)8/ * )]2 % 3̂]_ Z)*1)Z% ̂HTML nt t!e Sy>bo! 76& 0_% `

    Dcop67 I *̂4 + 3X1)% Sy>bo! % 3 21) I()U+ 0_% ` 8/ * ) % *1)* % ̂Sy>bo! 3]2 +I4+ 61 70 0)X4+I 0_% `

    Dn*sp7 - %paceFDtra"e7 - Dreg7 - 8Dlt7 - &Dgt7 - ) Dra &o7 - Dla &o7 - I

    3 Z)3 I()[R 4)I %1 Less TCan S @n q ® 76& 0_% ` 8/ * ) 61 7081)% &̂18 ^ 1 Less TCan S @n8/ ]2 Z O(%4+ )\4+I 8/ X4+I X4 + Z0_ )` Gro:ser I ® S @n I4+ Ta@ 36 X4 + [ * 1) 10_`Dlt7 X4 +8/ 0)Dlt7 .Z1 1 ® Less TCan S @n I4+ Gro:ser I 3&1)84+) 61 70 0) 176& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    43/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 2

    ]#&$e L#ToIJO(3]. ) 1 ] ] 701 .% Î+&¥I4+0 ̂ 80 701Z0_'() ` HTML "o=u>ent %& ]4 [4+%1 Se>ant = "ataStru=ture 3 .. &̂.& %& I2%/ [1I 81)% ̂3]2I 3XI 21)*176& * 0() 3 Ô( "o=u>ent I4+ 0R 4

    ./ ) 61 70Z X ̂[4+%1I4+ %1 *()7]1) Sty!e Lan@ua@e 76& % ̂BSS . ̂*% % Z%176& 0_% ` O_ 0 70™.1I ŸHTML %4+ ] 1 Gro:ser % Z ̂BSS Su$$ort I 3 %1 X)31)./ )] 0̂_% `

    •‘‘– ]4 & 1 3 0()*% ] %̂ ̂BSS ent % I4+ Sty!e X40 4+ 64 + BSS I4+ 31)I4+)X4 + Z] 0̂_ )`O_ cI1 ZZ 31 cIR6. X40 % ̂3 .. ̂9ta*le !e>ent % I4+ "o=u>ent Layout 3% I 3*R 4 )v0] ĉI0_% `

    61 7081)% ̂Layout I4+ Tab!e %& ]4X4 + 7 cI/ 0_` Ko: *R 4 )]4U+ 0_% ` 3X Ko: 1 Bo!u>n & ]4U+ 0()I2. Ko: & ]4 1 Bo!u>n %& ]4&(U+ cI0_% ` O(./ ). ̂9ta*le !e>ent % I4+ &1Z ) 1) 61 7064 +

    g4% 0 ̂"o=u>ent Layout 3% I *R 4 )] ĉI0_% ` %& 76/ )76/ ) Web "e#e!o$er % cI1) 3 X 3I2 %& ]4X4+ 76& X1% 3̂% I ŸHTML 0iX1 0() Se>ant = Web I4+ 31) 0)X1]2+. V Gro:ser BSS Su$$ort %384+I 3 X-1I 31) I1 )X1]2+. 19ta*le !e>ent I4+ 1) 61 7064 +0 *̂R 4)64 +V Layout 3% I *R 4 )64 +3 %1 X) 70. 0()%4+I % . )] Ẑ0_% `

    I . ]% 1 %1 Gro:ser BSS Su$$ort [4+%1 3 %1 X) 70/ &R 4 31) I1 ) . 0(76& 0_% ` Layout3% I %1 Tab!e % *R 4 ) .&Z1 X4+ %1 0_ )` XI % 1 Tab!e Layout %& ]4g1 BSS Layout X1I 70/ &R 4*0 Z0 7] )X/ ) U+ 0_ )` O_ cI1 3Z I 9ta*le !e>ent I4+ Layout 3% I *R 4 )% ̂ ]% U+ ] %̂ [4+%1 X1I 0 ̂ 701]2 0_% ` Iz. %1 %4 +X4+I X40 cI64 + g4% 0_ )`

    orU#JJ!"a `$eUe"JText % I4+ Eor>at X40 X4+% 3̂]_3*R 4 )v0 4+ % ̂ !e>ent % U+ 0_% ` 3 7]]R31)76 9* !e>ent I4+&1XR 4) % Go!d X40 64 +3*R 4 )v0 0()9i !e>ent I4+ kta! = v0X40 64 +3*R 4)v0 4+ 0_% ` O_ 0 Eor>at X40 % [4+%1 3 . %1 &1 % I4+ X4+0R 4 &R 61 70Z X *̂% % 7] )76& 0_% ` HTML "o=u>ent 8 ̂ 1

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    44/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    45/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML

    9inp&t !e>ent 3*R 4 )v0Z 0()t6pe Attr bute 1=text= X4 + *% % 0)Z0_% ` >$ty Ta@ %& ]476& % 3̂% I B!ose Ta@ . ̂Bontent U+ 0_ )`

    9inp&t type+,te9t,

    %& 7]1)3*R 4 )Y % ̂Attr bute % U+ 0_ *)% ` al&e Attr bute I4+ Text kn$ut 1 "efau!t Ja!ue 7064 +*R 4 ) 4+ 0_ % ` Text kn$ut 8 Î 3]2I 3XI % I4+ 3*R 4 )v0* I 70 [ &]2 Z rea"onl6 Attr bute. ̂I. *% 4+ 0_% ` "isa*le" Attr bute . ̂kn$ut I4+ Mute X40 4+ 0_% ` maxlength Attr bute . ^Text kn$ut 8 ^ 1 8/ * )] v0X4+% ̂&1XR 4)3 Z3% I I4+I. *% 4+ 0_% ` '0 1 F

    9inp&t t6pe8=text= ma9len.t(+,:,

    kn$ut . 3̂% Labe! % I4+ % ^ 6I 61 70 &]2 Z %19la*el !e>ent I4+ *R 4 ) 4+ 0_% `

    9la*el for+,fname, )irst ame9/la*el9inp&t t6pe8=text= id+,fname,

    9la*el !e>ent . ̂9inp&t !e>ent %4 +I4+ ]2+% [I 64 +3% I 9la*el !e>ent Z ̂for Attr bute19inp&t !e>ent Z

    ^ i" I4+ 8/ * ) 0)7] )76 ]2+% [I X4+I %10

    ^76& 0_% ` ZU+ 3I2 +)I %1

    3*R 4 )v0 * I „E rst ‰a>e„ [4+% ̂Labe! I4+ + 0 X4+I Z Text kn$ut 13X4+X4+ Eo=us 76& . & 10 7̂6& 0_% `

    kn$ut !e>ent . 0̂ 8̂/ * ) 4+ % ̂37]1) kn$ut 3 2 +)3&1) % U+ 0_ *)% `

    9inp&t t6pe8= pa** ord = I4+ 3*R 4 )v0* Pass:ord \4+I 8/ &64 +*R 4 ) 4+ 0_% ` Text kn$ut . ̂3 7]]R31)76 % 0 3*R 4 )v0* 3]2I 3XI % \4+I 8/ % 3̂]_ Star X) % 376& 701 )X ̂ 61 70 0) kn$ut 3 2 +)3&1)76& 0_% `

    9inp&t t6pe8= (idden = g1X/ ) Text kn$ut . ̂3 7]]R31)76 % 0_% ` O_ 0 hi""en [4+% ^3%4+ ) 3*R 4 )v0* I4+ 8/ * ) 61 70 1 g4% % ̂kn$ut 3 2 +)3&1)76& 0_% ` A$$! =at on % %/ [1I % ^3]_ O( H dden kn$ut I *.Z1. *̂ 3*R 4 )Y 0_% `

    9inp&t t6pe8= c(ec bo9 = I4+ %1 BCe=;box $t on % 8/ * )64 + 3*R 4)v0 4+ 0_% ` chec

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    46/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 5

    8 Î %& ]4%/ )I4+0 ̂ \ )] 0)% ̂ $t on 3 2 +)3&1)0_` O(X40 [1 ]2I Z64 +3% I 3 2 +) 3&1)% Z1 Kad$t on % I4+name Attr bute &4&/ ) 0)Z0_% ` '0 1 F

    9inp&t t6pe8=ra"io= name+,.ender, al&e8=male=9inp&t t6pe8=ra"io= name+,.ender, al&e8=female=

    9inp&t t6pe8= * bmit =¯ I %1 Gutton 8/ * )64 + 3*R 4 )v0Z0_% ` s&*mit Gutton g1 Eor>%& ]43% I 3 Z)3 I()[R 4 )76& 0_% ` s&*mit Gutton 3X40 X40 0R 4 I4+ ( ) PSP Y# !O1 80 U )

    0) 176& 0_% `

    4 * d d al&e Attr bute g1 Text kn$ut % 3% I "efau!t Ja!ue 61 7064 +3*R 4)v00_% ` BCe=;box . ̂Kad o$t on %4 +3% I %1 *I [4+ Z1 !e>ent Z ̂%. )64+)*% % 0)64 + *R 4)Z0_% ` Gutton !e>ent % 3% I %1al&e Attr bute I4+ Gutton 0i 1 0i% ̂Gutton Labe! 61 7064 + 3*R 4)v0 4+ 0_% ` '0 19inp&t t6pe8=s&*mit=al&e8=%a e=

    9inp&t t6pe8= re*et = g1X/ ) Gutton %& ]40 7̂6& 0_% ` reset Gutton I4+ + 0 X4+I Z kn$ut 31)XR 4) 1 8/ * )81)% 3̂]2I 3XI % I4+ U )X ) 0) 176& 0_% ` O( Gutton g1 *R 4 )* % ̂Gutton %& ]476& 0_% ` Web Eor> %& ]4 176/ * )&Z1 kn$ut q•— ]4 ]. 0_% [4+cI0_&4 +` 31)XR 4 ) 76/ 0() 76/ ] *̂ -

    1) .X4 + q•— ]4XR 4 )I4+ 70. U )70& ]2 % [4+% 3̂*R 4 ) 2 +)I XI % 1 U+ 0_ )` 1)X4 + 70. 76/ ]2 X ̂%& ]4 & ]40 Û+ 10_` O( Gutton 8/ 81) + 3*R 4 )v0* I %1 %& [ 1) + 0 +Z * 76/ ] *̂ -3I4. U )* 1)X4 + 3&

    3[R 4) 70. 8/ Z% 7̂0™.1 U+ 4+ 0_% ` sab ! ty [4+% ̂3*R 4 )v0Z3[ 70 \ O_ IcI/ [4+Z 38 )X4+30 ]2I %& &R 4%& Z1 U+ Z *R 4)* % ̂Gutton %& 2 +)0 7̂6& 0_% `

    9inp&t t6pe8= b tton = g1X/ ) Gutton %& 2 +)0 ̂76& 0_% ` * I %1 Gutton 3X % %& ]4*176& 0_% ` 13X40 X40 1 g4% 0_ )` Da#aS=r $t . ̂% ^ 6I 3*R 4 )v0X4+% 3̂]_ *1 3*R 4 )v0Z Gutton%& 2 +)76& 0_% `

    9*&tton !e>ent g1 X/ ) 9inp&t t6pe8=*&tton= . ̂ 3% % 0 7̂6& 0_% ` 8 )7]1)]2I I9*&tton !e>ent I Eu!! !e>ent %& ]476& % 3̂% I !e>ent Bontent . ̂B!ose Ta@ U+ 0_% ` '0 1 F9*&tton o>nloa"9/*&tton X4 + Z)Z 176& 0_% ` ZXO I %1 9inp&t t6pe8 =*&tton=

    al&e8= o>nloa"= X4 + Z)*1)7] ). ̂3% % 0 Ẑ 176& 0_% `

    9*&tton !e>ent Z ̂8 )7]1)]2I I X4+30 Z Eor>att n@ Ta@ % I4+ Bontent 1 8/ Z)X4 +Z 4+ 7] )0 ^76& 0_% ` '0 1 F9*&tton o>nloa" &b) file.p"f & b) 9/*&tton X4 + Z)*1) 4+ % ̂31)*1]2I U+ 176& 0_% `

    .1I kn$ut !e>ent & 2 +)I2. 0_ *)% ` Textarea . ̂Se!e=t Gox %4 +0 7̂6& 0_% ` * %4 +3% I %19inp&t !e>ent *R 4 )0_ )` Textarea 8/ * )64 +3% I 9textarea !e>ent I4+*R 4 )Z0_% ` 8 )7]1)]2I I 9textarea g1 9inp&t X4+ >$ty !e>ent g4% 0_ )` 36 30+% U+ % ̂Eu!! !e>ent 76& 0_

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    47/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 6

    % ` 0() %1 "efau!t Ja!ue *% % 64 +3% I 9inp&t t6pe8=text= 1X4+al&e Attr bute *R 4 ) 0()*% % X4 + Z0_ )` "efau!t Ja!ue I4+ 36 Ta@ . ̂30+% Ta@ cI1)8 ^ 1 Z) 0)Z0_% `

    '0 1 F9textarea efa&lt Text9/textarea

    Se!e=t Gox I4+ "ro$F"o:n Gox X4 +X/ ) ]i0_% ` 8/ * )64 +3% I %1 ®se!e=t¯ !e>ent I4+ *R 4 )Z 0_% ` + 0 X4+I Z \ )&Z1&1Z )I2X1 176& 0_% ` \ )&Z1&1Z )I4+ %1 ®o$t on¯ !e>ent % ^*% % 0) 4+ 0_% ` '0 1 F

    9select 9option al&e8=1= Apple9/option

    9option al&e8='= range9/option 9option al&e8=+= selecte" Mango9/option 9option al&e8=,= Grape9/option9/select

    9option !e>ent % 1al&e Attr bute *% % 81)%1I4+ *%+v00_` '0 1 F ran@e X4 + \ )&Z1&1Z ) 1 61 7081) 0 *Z %̂. 64+)3 . I q 76& 0_% ` al&e Attr bute 0)81)X/ ) Z0_% `

    0)81)Z %1 \ )&Z1&1Z ) 1 61 7081)% ̂ ran@e I4+0 ̂* Z ̂ al&e 3 .. 3̂*R 4 )v0* 1) 10_` .1I 80 *%+v0Z 1Iselecte" Attr bute 76& 0_% ` * I "efau!t \ )81) 0) &X4+% ̂9option !e>ent 18/ * ) 0)Z 1 76& 0_% ` selecte" Attr bute 0)81)% ̂9option U+ Z V 3 0i[R 4 )9option

    I4+ "efau!t 3 .. ̂ \ )81) 0) 10 ̂76& 0_% `

    S] L orU <9;"oct6pe html9html9hea"

    9meta charset8=UT)-0=9title HTM4 )orm9/title

    9/hea"9*o"6

    9h1 )orm $np&ts9/h1

    9form9la*el for8=fname= ame9/la*el 9*r9inp&t t6pe8=text= i"8=name= 9*r

    9la*el for8=email= Email9/la*el 9*r9inp&t t6pe8=text= i"8=email= 9*r

    9la*el for8=a""ress= A""ress:9/la*el 9*r9textarea i"8=a""ress= 9/textarea 9*r

    9*r9inp&t t6pe8=ra"io= name8=gen"er= i"8=male=9la*el for8=male= Male9/la*el

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    48/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 7

    9inp&t t6pe8=ra"io= name8=gen"er= i"8=female=9la*el for8=female= )emale9/la*el 9*r

    9*r9la*el for8=e"&cation= Highest E"&cation9/la*el 9*r9select i"8=e"&cation=

    9option High %chool9/option9option Kachelor9/option9option Post Gra"&ate iploma9/option9option Master9/option9option Ph. 9/option

    9/select 9*r 9*r

    9inp&t t6pe8=s&*mit= al&e8=sen"=9/form

    9/*o"69/html

    . .1 1 61 7081)% ̂Eor> I4+form.html E !e ‰a>e . ̂I ) *+ )[/ ) 0() Gro:ser . 6̂ cI/ Z 3]4X4+ZXO ZU+ 10 7̂6& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    49/515

    Profe !o"#$ %e& 'e e$o er 3]. ) q€ Hy$erText Mar;u$ Lan@ua@e F HTML 8

    4 * d d Gro:ser 1 61 70% 3̂]_ !e>ent % I4+ .1I %& X4+ )[ ) 0() 61 70 &]2 Z 9*r !e>ent I4+3*R 4 )v0 4+ 0_% ` 9*r [4+%1 L ne Grea; [4+% ̂3†+0˜_ 76& 0() Bontent . ̂B!ose Ta@ U+ % ̂ >$ty !e>ent %& ]4

    X/ )76& 0_% `

    [o"O$I !o"3]4 61 70] %̂ ̂ !e>ent % g1 \4+)\4+) Text "o=u>ent %& ]4I4+ HTML !e>ent % . ̂%/ [1I % ̂3]_3*R 4 )v0Z% ̂3 7]]R !e>ent 21)0 ̂76& 0_% ` 76/ & I % *1)64 +X4+% ̂ !e>ent . ̂Attr bute % I4+ *I [4+ Z13]. )3X4+I [I XI 61 70 0)* 1) 176& 0_% ` O(3]. ) 1 %1 V HTML "o=u>ent % g1A$$! =at on % Z 3̂ 7]]R "ata Stru=ture % 76& % [4+% 3̂]2I I4+ 38 )v0 % *1) &]2 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    50/515

    Profe !o"#$ %e& 'e e$o Š . ]% 1 Y ./ )0/1g1 37]1)./ )0/131)XR 4)Z ̂

    Ga=;Fend P!atfor> 76& X1 0(76& % 3̂% I V ./ )0/1U %4+ )

    X X1 * % ^ 1*1Z0 %& ]4 76& X4 +X1 .0_ 0(` ]4 X X I21 )*1)X % Z1V 37]1)0/1U % 3% I 0_ I4+3+ 1 Z ̂Profess ona! Web "e#e!o$er &1340 I 3 21) I()

    3 81I 3I v0 X4 + [ +0_% ‹

    K'()7 I21 * q" re=tor, Tota! |a>e$!ay Stud o Ltd

    AutCor >a !Ž autCor $:dboo; Webs teŽ Ctt$Ž}}$:dboo;

    mailto:[email protected]://pwdbook.com/http://pwdbook.com/mailto:[email protected]

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    51/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 50

    ( ) [# O#R!"a QJT$e QbeeJ K [QQTCe Wor!d : tCout BSS s @!y

    W B I BSS I4+6. %()] %̂ ̂Z/ \ ]2I I %1 "o=u>ent Bontent . ̂Sty!e I4+ ] ^ 7]1) 81)]2 X4 +76& 0_% `HTML I4+ Bontent Stru=ture %/ [1I 64 +3*R 4 )v0 0() 3 Ô( Bontent % I4+ X4+0R 4 &RV X4+ Sty!e . ^

    61 70Z X [̂4+%1I4+ BSS . ̂*% % Z% *̂ 176& 0_% `

    BSS Sty!e Lan@ua@e I4+%(8 6. %()64 + [ ) )cI %1 3[4+v0]2I Pro$osa! q‘ 2 +)8+ ZU+ ] ĉI0_% `3 Ô(8 Î q€ 2 +)I4+3 7]]R 0() %(8 64 + W B I[R 4 )76% ] 0̂_% ` Bas=ad n@ HTML Sty!e SCeets qBHS ^Strea>Fbased Sty!e SCeet Pro$osa! qSSP %4 +0 7̂6& 0_% ` BHSS I %1 I .% % I2 I2 3*R 4)v0

    .cI% ̂BSS . 0̂4+ 0() .()&0 0_% ` 3 . %1 BSS I4+ HTML % I0_ )V %& 7]1) Mar;u$ Lan@ua@e % ^X/ )% ^ 6I 3*R 4 )v0 4+ 0_% q'0 1 F ŸML, SJ|, Ÿ L ` O_ cI1 BHSS I . H I4+ 6 X4+I 0() BSS X4 +3 / % &] %̂10_`

    %& 7]1) Sty!e Lan@ua@e % . ^ % 0 ̂ BSS Z ̂%& 8 )7]1)]2I I %1 "o=u>ent %& ]43% I %& ]48I 04+% ̂Sty!e SCeets % % ^ 6I 3*R 4 )v0 4+ 0()V Sty!e SCeet %& ]4 I37]1) Sty!e SCeet %& ]48 Î *% % 81)]2I % I4+ Bas=ade qknCer t X40 0() [I XI 3*R 4 )v0 4+ 7] )0 ̂76& 0_% ` O_ cI1 X/ ) Bas=ad n@Sty!e SCeet X4 + ]i%10_`

    •‘‘– ]4 & O( 1X 1 BSS Z ̂08 [R 4) Jers on cI7 1] 0̂_% ` 3 . %1 BSS 1 Jers on X4 + *R 4 )0_)` BSS Le#e! ‚ X4 + ]i0_% ` 3]4 .1I [R 4 ) HTML5 . ̂% ^ 6I 0_Y X1% ̂ BSS I4+ %1 BSS Le#e! X +]i0_% ` XI U+ % % I2 I2 3*R 4 )v0 .cI%1I %1 €——” ]4 & 6 61 Y_Z( 1 cI 7 1] %̂ ̂BSS

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    52/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 51

    F &*76 !e>ent I4+ X4+ Sty!e . ̂ 61 70Z X [̂4+%1I4+ *% % cI7 181)% ̂ cI7 1]2I 21)0 ^76& 0_% ` Z)*1)0R 4 Syntax I4+-V 1 ( W ) 1 cI/ 0_`

    -V 1 ( W ) BSS Z)*1)0R 4 Z)8R 4 )

    Se!e=tor, Pro$erty, Ja!ues O(*R 4 ) 2 +)0 Û+ %10_` Se!e=tor [4+%1h1# p# img# li &% ̂HTML !e>ent% I4+ \ )]2 7] )76& 0_% ` Pro$erty % I %1color# *acent % 31)XR 4 )I4+&1XR 4)3&+ ) Z1 . ̂ 61 700_X4 + BSS . ̂3]4X4+

    cI7 1 0) 4+ 0_% F

    p color: green7N

    . .1 1p I Se!e=tor 76& 0_% ` color I Pro$erty 76& 0()green I %1 Ja!ue 76& 0_% `

    XAC K [QQ Qe$eOJorBSS 1 .R0_% q• 3 Z)3 I()[R 4 )I Se!e=tor 76& 0_% ` !e>ent 0_ ) 21)& 1. ̂6 ^ &/ )81)% ̂ HTML"o=u>ent %& ]48 Î I4+ Sty!e *% % X4+% ̂ !e>ent I4+ Se!e=t X40 \ )]2 4+ 7] )g1 08 [R 4)X4+30

    ]2I 76& 0_% `Se!e=tor % 8 ^ 1 3 7]]R3I2[R 4)I %1 !e>ent Se!e=tor, k" Se!e=tor . ̂B!ass Se!e=tor %4 +0 ̂76& 0_% `

    !e>ent Se!e=tor I %1 HTML !e>ent ‰a>e . ̂Se!e=t X40 7] )76& 0_% ` / */ HTML !e>entI4+ [4+ ‰a>e 3%4+ ) BSS . ̂Se!e=t X40 4+ 0_% ` . .1%& ]2 + 61 70 0)0_ F

    body *ac

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    53/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    54/515

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    55/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 5

    Z)g. I4+ 31) 0)cI 0 %& ]2 +IX/ ) &1XR 4)%& XR 4) & XR 4)*I *1X/ ) ./ ) ) [4+% *̂ 1. ̂ .noteZ)g. I4+ 31) 0)cI0_% `

    4 * d d HTML "o=u>ent %& ]4 1 k" % % ̂ !e>ents & ]4 U+ * 0_ )` BSS I %1 k" % % ̂ !e>ent & ]4 U+ .X/ ) & ]4XR 4)3% I 3X40 X40 * 1) 10_0 ^̀ O_ 0 * 1Y3Z k" [4+%1 !e>ent % I4+ kdent fy X40 %10_` n ue76& Z0_% ` BSS 1 70™.1 U+ 0 .1I 04+ ) Da#aS=r $t . ̂ !e>ent % I4+ &( R% 3̂]_ k" % % ̂ !e>ent % U+ .Z X4+X1)30 % ̂3]I 3] ^ % %Z 176& 0_% ` B!ass I %1 !e>ent % I4+ B!ass fy X40 %10_` * 1Y3Z I4+I 3 2 +)% Z1&464 + *R 4)Z%176& X4 + 61 700R 43 2 +) 3&1)% % ̂ !e>ent % I4+ B!ass 3% % 0)%1 X40 * % 3̂X40 %& ]40 7̂6& 0_% ` ErontF nd x$ert % I %1 BSS 3% I !e>ent % I4+ k" 0)0 ̂B!ass 0)%1I04+* %1 % X4 +3cIRv0cI X U+ 0_% `

    XAX K Q$!abJ$T lR #"OeR [QQ Qe$eOJor3./ ) 8 )7]1) 0() 3*R 4 )Y % ^ Se!e=tor %& ]2 +I4+ 80 R 61 700_ ` 3 Ô_ % I %1 "es=endantSe!e=tor, BC !d Se!e=tor, Attr bute Se!e=tor %4 +0 ̂76& 0_% `

    "es=endant Se!e=tor [4+%1 !e>ent %& ]43% ) 1 80 [ U+ .% ̂ !e>ent % I4+ Se!e=t X40 64 +*R 4 )0_% ` ‰ested Se!e=tor X4 +X/ ) ]i0_% ` "o=u>ent %& ]4 1U+ * - !e>ent %4+ )I4+ B!ass % k" %X4+I 0) .&Z1 X4+0 ̂ \ )]2 Se!e=t X40 4+ % ̂ ./ )X )76& X4 + 3X . 3*R 4 )Y 0_% ` HTML !e>entStru=ture X)%& ]4. ̂% ^ cI/ ]2 0_% `

    9a href8= = &tsi"e 4ino9/a 9/strong9/p

    O(. .1 19a !e>ent *R 4 )]40_Y 0_% ` %& ]4I *()7]1)U+ .%10_` & ]4 I %19p !e>ent 8 ^ 1 U+ .%10_9̀p !e>ent 3% )8 Î 9a %& ]4 I 9strong !e>ent %& ]43% )8 Î4+80 Z1I .0_

    *)% ` 3 Ô(9a !e>ent % I4+ O(./ ). ̂Se!e=t X40 4+ 0_% `

    p a color: gra67N

    p spaceF a X4 + Z)*1)81)%10_` 3 Ô( spaceF I4+ "es=endant Se!e=tor 3 .. ̂*R 4 )X4+I %176& 0_% ` 3†+0˜_ I „ 9p !e>ent 3% )8 Î 9a !e>ent % I4+ Se!e=t X40 X4+I 0_„ X4 +3†+0˜_ Z0_% ` O_ cI1 9p !e>ent 3% )8 Î 9a !e>ent & ]4XR 4)I4+ \ )]2 X4+I % ̂* 1X/ )76& 0_% ` O_ 0 370 I 1 *()7]1)U+ .% ̂9a I4+ %1 8/ * ) Se!e=t X40 1 g4% 0_ )`

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    56/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 55

    4 * d d . .1 !e>ent Stru=ture 19a !e>ent % 3% I href Attr bute 1 KL 3&& 3 . 0)81)0 ̂S @n X)I4+ 0)81)0_% ` 3 Ô_ 13†+0˜_ g4% 0_ )` . .1 *I *I 61 70]2 %176& X4 + KL 3&& 3 . 8/

    %1 0 ̂]0 X X S @n X)%& ]4%/ ) 8/ 81)X4+I %176& 0_% ` S @n X)g1 KL 1 8/ * ) 3*R 4)v0 4+ % ̂Ja! d S @n 76& X4 + %& 7]1) * I…% % 3&1) S @n I4+ . .13 .. 3̂*R 4)v0%10_`

    p *tron. a color: gra67N

    p spaceF strong spaceF a X4 + *R 4)81)0_% ` 3†+0˜_ I „ 9p !e>ent 3% )8 ÎV9strong !e>ent 3% ) 1 U+ .% ̂9a I4+ Se!e=t X40 0_„ [4+% ̂3†+0˜_ 76& X4 + 0)81)% ̂ Stru=ture

    8 Î kns de L n; T:o %& ]4 %/ )I4+0 ^ \ )]2 * 1) 176& 0_% ` O(./ ). ̂ !e>ent %& ]43% ) 1 80 [ U+ .% ̂ !e>ent % I4+ Se!e=t X40 * 1) 4+ 0_% ` XI % Proje=t % 1 Z)*1)3*R 4 )v0 X U+ % .̂ .1%& ]2 +80 R 61 70X4+I 0_% `

    (eader a text-"ecoration: none7 color: *lacent %& ]43% ) 1 80 [ U+ .% ^!e>ent I4+0 ̂Se!e=t X40 %10_` I 17]1)]2I I %1 "es=endant Se!e=tor I !e>ent %& ]43% ) 1U+ * -

    I4+I /(% ̂ !e>ent % 31)XR 4 )I4+ Se!e=tor X40 * 1) 10_` BC !d Se!e=tor I %1 " re=t BC % ^!e>ent % I4+*1 \ )]2 0) 10_` 80 [ !e>ent % . Û+ .% ̂37]1) !e>ent % I4+ 8/ * ) Se!e=t

    X40 0) 1 g4% 0_ )` "es=endant Se!e=tor X X164 + *R 4 )] %̂ ̂ !e>ent Stru=ture I4+0 ̂70. X/ 3*R 4 )v0]2 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    57/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 56

    9a href8= = &tsi"e 4ino9/a 9/strong9/p

    9p !e>ent 3% )8 Î 9a !e>ent I4+ O(./ ). X̂/ ) Se!e=t X40 4+ 0_% `

    p ) a color: gra67N

    Arro: * I…% X)I qp BC !d Se!e=tor 0 7̂6& 0_% ` 3†+0˜_ I „ 9p !e>ent 3% )8 Î " re=tBC !d 76& % ̂9a !e>ent I4+ Se!e=t X40 X4+I 0_„ [4+% 3̂†+0˜_ 76& 0_% ` O( Se!e=tor I kns de L n; ne[4+% ̂9a !e>ent %& ]4%/ )I4+*1 \ )]2 0)* 1) 10_` kns de L n; T:o [4+% ̂9a !e>ent I4+ %1" re=t BC !d g4% 0 ̂9strong !e>ent 3% )8 ^ 1 80 [ U+ .%176& X4 + 8/ * ) \ )]2 * 1) 1

    g4% 0_ )` O_I BC !d Se!e=tor . ̂"es=endant Se!e=tor %4 +Z Î 17]1)]2I 0 ̂76& 0_% `

    .1I %& ]4 I %1 Attr bute Se!e=tor 76& 0_% ` !e>ent 1 0)81)% ̂Attr bute . ̂Se!e=t X40 %1 76& 0()* X/ )0 ̂ 3 %1 3*R 4 )Y % ̂Se!e=tor 76& 0_% ` X) O_ I )3% ) 1 Z) 0)Z0_ % ` '0 1 F

    titleF [4+%1title Attr bute U+ % ̂ !e>ent 31)XR 4 )I4+ Se!e=t X40 X4+I 7] )76& 0_% ` img altF[4+Z %19img !e>ent % 8 Î alt Attr bute U+ % ̂ !e>ent % I4+ Se!e=t X40 X4+I %10_`img alt8=)eat&re=F [4+Z %19img !e>ent % 8 Î alt8=)eat&re= X4 + *% % 81)% ^

    !e>ent % I4+ Se!e=t X40 %1 76& 0_% ` 38 )*76 9inp&t !e>ent g1 * %& ]4%/ ). ̂ text#ra"io# *&tton &*76 Ty$e 3 2 +) 2 +) *% % 4+ % 3̂% I 3 Ô(t6pe Attr bute I4+ 3 7]]R 0() Se!eX40 0)64 + X4+30 %I 0_% ` . .1%& ]2 + 61 70X4+I 0_% `

    inp t;type+te9t< *acent % I4+ Se!e=t X40 Z%1 21)& 18+ Z1I X I * 1) 10 7̂6& 0_% `

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    58/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 57

    XA\ K P eIRoWO$# ePseudoF=!ass % g1 BSS Se!e=tor Z 3̂&+% 304+ )%& Z0 76& 0_% ` !e>ent Z ̂„3 7]3 .„ 0i %/

    0() Se!e=t X40 % .̂/ )X ) % 76& 0_% ` 3 7]3 .[4+%1IV 3*R 4 )v0* I !e>ent I4+ Mouse . ̂ 81I X4+I % 3̂]_V 3*R 4)v0* I !e>ent I4+ B! =; X40 X4+I % 3̂]_V !e>ent I Eo=us 76& * 1)% ̂3]_V !e>entI .1I [R 4) !e>ent 76& .% ̂3]_ &*76 !e>ent % Z ̂ X4+3 7]3 . 1 X4+ Sty!e 61 70X4+I 0_X4 + *% % 4+ 64 + Se!e=t X40 % ̂Se!e=tor % 0 ̂76& 0_% `

    :ho er PseudoF=!ass I !e>ent I4+ Mouse . ̂ 81I X4+I % 3̂]_ 61 70 &X4+% ̂Sty!e % *% % 64 +*R 4 )0_% ` 3*R 4 )v00R 4 I %1 F

    a /(over color: re"7N

    O(X4+ Z)*1) [4+Z 9a !e>ent % I4+ Mouse . ^ 81I X4+I % 3̂]_ &1XR 4)3.( Z1 701 ) 0) 1 76& 0_% ` :ho er 30_3Y PseudoF=!ass 3 21)&4 I4+ / */ !e>ent . ^ [4+ % ^ 6I 3*R 4 )v0 4+ 0_% `

    61 70] ^ 0()76& % ̂Se!e=tor % . X̂/ ) % ^ 6I 3*R 4 )v0 4+ 0_% ` '0 1 F

    na li /(over *acent . *̂1% ^ 6I 3*R 4 )v0 4+ 0_% ` %& I+ * 1)6 ) % ̂ KL I4+~ . )81)% ̂L n; % I4+ %& I+ * 1)6 ) *)% ̂ KL I4+ ~ . )[4+81)% ̂L n; % . ̂ % I ^ 701) 31 Sty!e

    % *% % 64 + 3% I *R 4 ) 4+ 0_% ` |oo@!e Sear=C %4 + W ; $ed a %4 +X4+ Webs te % 1 X X1c Z X/ ) % 4+ 0_X+ ` * 1)6 ) *)% ̂L n; % I 3 Z1 %& 2 +)V %& I+ * 1)6 ) 0()*1) L n; %3 Z1 %& 2 +)]

    ^ 7]1) 61 70%I cI0_% ` 3 . %1 O(X4+]

    ^ 7]1) 61 70%1g1 3*R 4 )v0* 3% I 21)& 13 81I

    3I 76& X4 + Iz. %1 %4 +IX/ ) L n; % I4+: isite" *R 4 ) 0() I ^ 701) 31 Sty!e % *% % 0)81)* 0_% `

    a color: *l&e7N

    a /vi*ited color: gra67N

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    59/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 58

    O(X4+] ^ 7]1)*% % 0)X4+I Z * 1)6 ) *)% ̂L n; % I4+ &1XR 4)3701. 7̂0 0) 0() * 1)6 ) 0()*1) L n; %] ^ Z1 &1XR 4). ̂70* 0) 10 7̂6& 0_% `

    :acti e PseudoF=!ass I %1 !e>ent I4+ B! =; + 0 X4+I % 3̂]_ q*4 + g4% Tou=C X40 X4+I % 3̂]_61 70 &X4+% ̂Sty!e I4+ *% % 64 +3*R 4 )v0 4+ 0_ % ` * X/ )0 ^ / */ !e>ent . ^ [4+% ^ 6I 3*R 4)v0 4+ 0_

    % ` O_ 0 3*R 4 )v0* B! =; + 0 X4 +Z !e>ent % . *̂1% ^ 6I 3*R 4 )v0* 0_% `

    *&tton /active *achite7N

    inp&t t6pe8textF /foc * *acent % 8 Î 08 [R 4) !e>ent %& ]4%/ )I4+ 8 )7]1) 61 70 &X4 +% ̂ Sty!e % *% % 64 +*R 4 )0_% ` :last-chil" PseudoF=!ass X/ )* 1%Z1)3% % 0_0 ^̀ :last-chil" I Se!e=t X40 81)% ̂ !e>ent % 8 Î .1I [R 4 ) !e>ent%& ]4%/ )I4+ 8 )7]1) 61 70 & X4+% ̂ Sty!e % *% % 64 +*R 4 )Z%176& 0_% `

    na li /la*t=c(ild *or"er: ! none7N

    page p /fir*t=c(ild font->eight: *ol"7N

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    60/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 59

    XAg K _roI !"a Qe$eOJor61 70] %̂ ̂Se!e=tor % I4+ |rou$ X40 0() %1 X/ ) 3*R 4 )v0 4+ 0_% ` 61 70 &X4+% ̂Sty!e % % 3̂]_ BSS

    Ku!e % I4+ 80 ]_80 ]_70. Z)0 ̂%& I+ %/ ) Z)X4 +Z 4+ 10_`

    p.note *ac footer -copyri.(t> code

    *ac

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    61/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 60

    p *acent % I4+ .1I ]R3Y_ Z1 *% % X4+I %10 ̂76& 0_% ` rg*23 Eun=t on I4+3*R 4 )v081) 0() 38 ^ 1 Para>eter *R 4 )]43 .. ̂Ked, |reen, G!ue 3&' X4+I 0)Z0_% ` *% % 0) 4+ % ^

    w . )%. 64+) % I %1 £ I . 55 38+76& 0_% ` rg*2' # !# !3 [4+Z So! d Ked I4+ Z 10_Ked .Z1 1 55 370/ 0)81) 0() I2. |reen . ̂G!ue 3% I £ *% % 81)X4 +76& 0_% ` 3X1)% 0 ^rg*2!# ' # !3 [4+Z So! d |reen,rg*2!# !# ' 3 [4+Z %1 So! d G!ue 3 Z1 I4+ ZU+ 10 7̂6& 0_% ` rg*2!# !# !3 I 3.I Z1 76& 0_% ` I . 02 %1 S=reen 3% I 3 Z1 U+ %1I 3.I

    Z1 76& 0_% ` rg*2' # ' # ' 3 [4+Z %1 376 Z1 76& 0_% ` *R 4 )]4XR 4 ) 370/ 0_ ) &0 X4+I Z Z 4+ % 3̂X )[R 4 )3 Z1 76& % ̂376 Z1 I4+ ZU+ 7] )76& 0_% ` rg*2'!!# !# !3 [4+Z %1 3.(Z

    Z1 I4+ZU+ 10_` Ked I4+ 370/ 0)0 ̂ ££ X4 + 0)81) 0() |reen . ̂G!ue I £ 76& .% ̂3% I 3.I Z1 I I4+0_% ̂3.( q3.(Z I4+ ZU+ 176& 0_% ` . .1 1 %1rg*2' # ' # !3 X4 + Z)81)0_% `

    rg*23 1 Pr >ary Bo!or %& ]476& % ̂3Y_3% I 3 Z1 0_ 0 3.(. 3̂&+ )I4+ Z1&0 X4+I Z 3Y_

    Z1 ZU+ %10 ̂76& 0_% `

    -V 1 ( W ) BSS K|G Bo!or

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    62/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 61

    .1I 80 3*R 4 )v0 4+ % ̂Bo!or Ja!ue I %1 Hex Ja!ue 0 7̂6& 0_% ` Hexade= >a! w . )&.& . ^ Z)*1)Z 0_% `

    p *aca! ‰u>ber syste> 1 £ I . ¶ 38+ w . ) q•— XR 4) 0_Y 0_% ` Hexade= >a! 1 %1 £, ‚, , , ¤, 5, ³, ´, ¢, ¶, A, G, B, ", , E [4+ 0() w . ) q•– XR 4) 0_Y %176& 0_% ` ‰u>ber Syste> % 3 cI1 )I4+ %1 O( .Z1 1 3 *)&+% 701 4+ %1 0_ )` 3cI )62 )

    31)76 Hex %. 64+) EE g1 "e= >a! %. 64+) 55 . ̂/(% X4 +0 ^ % 81) &]2 0_% ` O_ cI1 Hex Ja!ue1 3.+ [R 4)I ££ 76& 0() 37 [R 4 )I EE 76& 0_% ` . .1 1 0)81)% ̂q– XR 4 )% ^ EEEE££ g1 K ° EE, | °EE . ̂G ° ££ [4+% 3̂†+0˜_ 76& 0_% ` Ked . ̂|reen 3% I 37 [R 4 )XI ]R 4+ % ̂EE X4 + *% % 81) 0()|reen I4+ ££ *% % 81)% 3̂% I * X/ )0 3̂Y_ Z1 I4+ZU+ 1 76& 0_% `

    -V 1 ( Wc) BSS Hex Bo!or

    4 * d d Hax Ja!ue % g1 370/ 3&R 4[4+Z q– XR 4)% ^ Z)Z 0 3%4+ I1I 3 .. ̂qš XR 4)0 ^ Z)X4 +X/ )Z0_% ` '0 1 F ²EEEE££ 3&1) ²EE£ X4 + Z) 4+ 0_% ` ²¢¢AA"" 3&1) ²¢A" X4 + Z) 4+ 0_% ` ²EEEEEE 3&1) ²EEE

    X4 + Z) 4+ 0_% ` ²££££££ 3&1) ²£££ X4 + Z) 4+ 0_% ` 0() %1 &1XR 4)3 I()3 *)X/ ) 70™.1 U+ 0_ )` & *I Z1*R 4) 4+ 0_% ` ²ffff££ X4 + Z)*1)Z X/ )3X40 X40 10 7̂6& 0_% `

    Bo!or Ja!ue % 3 cI1 )*+ 0([4+Z Ga=;@round Bo!or *% % %1IX * 1)0_ 0(` 61 70] %̂ ̂Bo!or‰a>e, K|G . ̂Hex Ja!ue %4 +I4+ ba=;@roundF=o!or 3% I % I0_ ) &1XR 4)3 Z1 % V Gorder 3 Z1

    % &*76 Bo!or Ja!ue 0)X4 +Z% ^ .Z1%4+ ) 1 3*R 4)v0 4+ 176& 0_% `

    *+U+ 31 K|G Bo!or % I ]2I 3X40 X40 0R 4 I4+ 8/ * ) 61 81) 0 XI % 1 3 Z1 % I4+ I4+ %4+ % I 0() &0 .64 + X4+0_ )` 2I &+. 7̂ .% 3̂ Z1 I4+ 81I X4+I R 4 . ̂ Bo!or Bode % 70. 84% 0)% ^

    Bo!or P =;er Too! % 3 21) I()U+ 0_% ` O( .Z1 1 3[ 3 70[R 4)I %1 Bo!or¦ !!a X4 + ]i% ̂E refox

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    63/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 62

    Addon 0 7̂6& 0_% ` O( Addon 8/ * )X4+I Z Webs te % 0iI 7 .Z% 3̂ Z1 I4+ 81I 4+ *X4+Bo!or B r=!e 0i 1 3 Z1 % 0_ )&0 0() %1 X/ ) Bo!or Bode % Z 4+ 0_ % ` Bo!or Bode I4+X/ )Hex, K|G, BSS Bo!or Eun=t on % 8 ^ 1 %& ]430_3Y 76& % ̂HSL, Pr nt "es @n 1*R 4 )% ̂BMŒl &*76 3 2 +) 2 +)I4+70. 0) 4+ 0_% ` 3I &0 81)% 3̂ Z1 I Bo!or ‰a>e 3 .. Û+ ] Ẑ X/ ) % ^ 6I 61 70 0)0_% ` Web "e#e!o$er % 3% I U+ 76& Gro:ser Addon 8 ^ 1 %& ]430_3Y 76& 0_% `

    -V 1 ( W ) Bo!or¦ !!a E refox AddonL n;ŽCtt$Ž}}:::e . ̂%& 7]1) Gro:ser % 3% I X/ ) 3X1)% xtens on % U+ 0_% ` knsta!! X40 0R 4 . ^3*R 4 )v00R 4 3 *)&+% I4+ %1 &16% * I4+ %4+ U 1 6 X X1 0() & )*0 cI/ &]2 0_% `

    Iz. %1 %4 + X X1XI & BSS Ga=;@round Pro$erty % 3 cI1 )70. * 1)0_ ` Ga=;@round k>a@e %8/ * )64 +3% I ba=;@roundF >a@e Pro$erty I4+*R 4 ) 4+ 0_% ` Ga=;@round k>a@e . ̂0I *I 0() 3I. 3*% & ]4U+ 0_% ` %& ]4 I !e>ent % 1 Ga=;@round k>a@e %& ]40 Û+ 4+ 0_% ` !e>ent %& ]43% I Ga=;@round k>a@e & ]4*R 4 )]4 0_ )&0 *% % X4 + Z0_ )` .1I %& ]2I I %1 V Ga=;@round k>a@e ^S Ne I4+ BSS . *̂% % X4 +Z 1 g4% 0_ )` O_ cI1 Ga=;@round 3 .. ̂k>a@e I4+ 3*R 4 )v0X4+% [4+Z 3*R 4 )v0X4+% ̂S Ne Z 31 I+% 70 [ 0)81)Z 176& 0_% ` 0R 4 I !e>ent 8I I() .X4 + „./ )./ )

    *) 0() Ga=;@round 376& *R 4 )X4+I 0_„ [4+% *̂% % ]2I 2 +) BSS . ̂ *% % 4+ 0_ )`

    4 * d d BSS 1 %1 3]4 701 .% ^ Mu!t $!eFGa=;@round Z1 Ga=;@roundFS Ne 0_ *% % X4 +ZX10_ 0(`

    http://www.colorzilla.com/http://www.colorzilla.com/

  • 8/15/2019 Professional Web Developer 2.1 by Ei.maung

    64/515

    Profe !o"#$ %e& 'e e$o er 3]. ) qš Bas=ad n@ Sty!e SCeets BSS 6

    Iz. %1 %4 + 1alert.png [4+% ̂k>a@e X)%& ]4 U+ % [4+cI0_&4 +`

    a!erta@e X)I4+9p class8=alert= !e>ent 3% I Ga=;@round 376& 3*R 4)v0X4+Z 3]4X4+ Z)*1)4+ 0_% `

    p.alert bac .ro nd=ima.e/ rl?,alert-pn.,@6N

    *ac

  • 8/15/2019 Professional We