Básicos Html5 e JavaScript

download Básicos Html5 e JavaScript

of 100

  • date post

    02-Mar-2018
  • Category

    Documents

  • view

    224
  • download

    0

Embed Size (px)

Transcript of Básicos Html5 e JavaScript

  • 7/26/2019 Bsicos Html5 e JavaScript

    1/100

    !"#"$%

    $

    Redes e Sistemas Multimdia II

    Comunicao e Design Multimdia

    HyperText Markup Language

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 2

  • 7/26/2019 Bsicos Html5 e JavaScript

    2/100

    !"#"$%

    &

    HyperText Markup Language

    ! '()* ,!"#$%&$'( )*%+,# -*./,*/$, - ./01 1234 56 7621 86 9.523:0;?5620$11@ 9.521/01531A1531@ 86 BBBC

    ! D '()* 506>1A 81=:.>:6A6;06>1A 81F.:A636;1A 5. 19:?0 1A $##$ 5. OPQR G23.4$56 7,%3#8$.#3,% 6* :$;

  • 7/26/2019 Bsicos Html5 e JavaScript

    3/100

    !"#"$%

    Z

    HyperText Markup Language

    ! P236 F.:A6 81 =1:A?3?: 9:0U6: :1F1:V59?62153:1 8.90A153.2 81 F.:A6 ?523653W516 1:6@ 1-@ 81 >:6581 03?E?8681 5. A058. 9?153LF?9.@3653. .0 A6?2 8. /01 56 K?86 /0.3?8?656C

    ! [ =6: 9.A . '()*@ 20:>?0 36A7-A .=:.3.9.E. '((\ G!"#$%&$'( &%*.4>$% ?%3(3;36H/01 20=.:36 6 3:652F1:V59?6 81 F?9X1?:.2 '()*G1 .03:.2H 63:6K-2 86 I531:513C

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 5

    HyperText Markup Language

    ! D '()* 2.F:10 K4:?62 1K.E0;Y12 6. E.5>. 8.31A=.@ 2158. 6 K1:21 6 A6?2 03?E?U686C

    ! O.5308.@ 6 5.K6 ?31:6;

  • 7/26/2019 Bsicos Html5 e JavaScript

    4/100

    !"#"$%

    ]

    HyperText Markup Language

    ! `A6 =4>?56 '()* - 9.523?30L86 =.: 0A9671;6EX. GheadH 1 =.: 0A 9.:=. GbodyHC

    ! R. 9671;6EX. 159.53:6AT21 ?5F.:A6;Y12:1E63?K62 6. 9.531M8. 86 =4>?56@ 9.A. . 3L30E.GtitleH 1 .03:6 A136T?5F.:A6;?56C"a 1J91=;1 5. 5.A1 86

    =4>?56 G56 _651E6 8. 1%304$%H@ 6 :1236531?5F.:A6;1 3.8. .9.531M8. /01 - A.23:68. 6. 03?E?U68.:@/0658. 1231 69181 6 1226 A12A6 =4>?56C

    ! (.86 6 F.:A636;?56 - F1?36

    63:6K-2 81 (*/49.A. 1 @1 @ 1 @ 153:1A0?362 .03:62C

    ! [ >:6581 A6?.:?6 862 (*/42

  • 7/26/2019 Bsicos Html5 e JavaScript

    5/100

    !"#"$%

    !

    HyperText Markup Language

    ! \.: 1J1A=E.@ . 31J3. /01 21 159.53:1 153:1 1 F?96 F.:A6368. 696::1>68.c texto !!"#!$C

    ! [ (*/81 F19X. - 8?23?5>0?86 86 81 671:30:6=1E6 76::6 d/e G1C>C@ 1 HC

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 9

    HyperText Markup Language

    ! [ 123:030:6 >1:6E 81 0A6 =4>?56 - 1236c

    ...

    ...

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 10

  • 7/26/2019 Bsicos Html5 e JavaScript

    6/100

    !"#"$%

    %

    HyperText Markup Language

    ! [2 (*/4G.0 1E1A153.2H '()* =.81A 9.531:63:?703.2 /01 6F1936A 6 F.:A6 9.A. 62 12362F.:A636A 6 =4>?56C

    ! D2 63:?703.2 21A f F:1531 81 0A6 (*/G81 ?5L9?.H@ A626?586 9.53?8.2 153:1 de G. 45.*6 A$ @$.3%1 . 45.*6 A$ @*53%HC

    ! [220A1A 3?=?96A1531 6 F.:A6 ...C

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 11

    HyperText Markup Language

    ! [ >:6581 A6?.:?6 862 (*/4=1:A?311596=20E6A153.@ 2158. 1236 6 F.:A6 8181F?5?: F.:A636;Y12 A6?2 9.A=E1J62C

    ! I23. -@ =.81A.2 026: (*/4g8153:.h 81 (*/4

    =6:6 9.A7?56: K4:?.2 3?=.2 81 F.:A636;

  • 7/26/2019 Bsicos Html5 e JavaScript

    7/100

    !"#"$%

    i

    HyperText Markup Language

    ! \4>?56 G...H

    "P2362 (*/4?58?96A 6. 1%304$% /01 1236 21 3:636 810A6 =4>?56 1A '()*@ 1 /01 3.8. . 9.531M8.9.53?8. 153:1 12362 8062 (*/4- '()*C

    ! O671;6EX. G...H"N

  • 7/26/2019 Bsicos Html5 e JavaScript

    8/100

    !"#"$%

    k

    HyperText Markup Language

    ! N1>01AT21 6E>0A62 862 (*/4A6?2 9.A0528153:. 8. 9.:=. 81 0A6 =4>?56 '()*c

    "(L30E. GA6?.:Hc ...

    ! D 31J3. /01 21 159.53:6: 153:1 12362 8062 (*/4 -A.23:68. 5. 1%304$% 6 96::1>68. 1 9.A 0A 36A65X.81 E13:6 20=1:?.: 6. 36A65X. 81F?5?8. =.: .A?2268.c...! D 31J3. - A.23:68. 6 96::1>68.C

    "I34E?9.c...! D 31J3. - A.23:68. 6 ?34E?9. G.0 81 .03:6 F.:A6

    g15F43?96hHC

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 16

  • 7/26/2019 Bsicos Html5 e JavaScript

    9/100

    !"#"$%

    #

    HyperText Markup Language

    "IA6>1Ac! P236 (*/51A 56 =4>?56 '()*@ 2158.

    ?58?968. 5. 63:?703. src. 5.A1 G1@ 21 5191224:?.@ .96A?5X.H 86 ?A6>1AC

    ! D03:.2 63:?703.2@ 21 71A /01 563m:?.2@ 0206?29.A 1236 (*/@ 20:6 1 6 6E30:6 86 ?A6>1A@6. A12A. /01 31A=. /01 :121:K6A . 12=6;. =6:6 6

    ?A6>1A 56 =4>?56C! PJ?231 6?586 . alt@ /01 =1:A?31 6=:121536: 0A6

    8129:?;1A 1A F.:A6 31J306EC

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 17

    HyperText Markup Language

    "'?=1:E?>6;6;?56 '()*@

    2

  • 7/26/2019 Bsicos Html5 e JavaScript

    10/100

    !"#"$%

    $^

    HyperText Markup Language

    "O.A X?=1:E?>6;Y12 36A7-A - =1:A?3?86 6 9:?6;

  • 7/26/2019 Bsicos Html5 e JavaScript

    11/100

    !"#"$%

    $$

    HyperText Markup Language

    "*?5X6 21=6:68.:6c ! N1:K1 =6:6 ?521:?: 0A6 g76::6h 5. 8.90A153. GF059?.56

    9.A. 0A 21=6:68.:HC! R15-:?9. 81 0A6 E?236 5

  • 7/26/2019 Bsicos Html5 e JavaScript

    12/100

    !"#"$%

    $&

    HyperText Markup Language

    "*?2362 81 81F?5?;15-:?9. 81 0A6 E?236 81 81F?5?;

  • 7/26/2019 Bsicos Html5 e JavaScript

    13/100

    !"#"$%

    $Z

    HyperText Markup Language

    ! *?5X6 3670E6: G(*16$ %30Hc ..."N0:6 86 9-E0E6C [ 2.A6 8.2K6E.:12 81F?5?8.2 1A width@ 50A6 8686 (*16$ %30@ 81K1A=1:F6U1: . K6E.: 3.36E 8. width81F?5?8. =6:6 6 3671E6C

    !

    O671;6EX. 81 9.E056 G(*16$

  • 7/26/2019 Bsicos Html5 e JavaScript

    14/100

    !"#"$%

    $]

    HyperText Markup Language

    ! O62. 21 =:131586 31: 0A6 9-E0E6 /01 .90=1 . 12=6;.8123?568. 6 8062 .0 A6?2 9-E0E62 G5.03:62 9.E0562H@81K1 026:T21 . 63:?703. colspan9.A . K6E.: ?58?963?K.8. 5MA1:. 81 9-E0E62 6 .90=6:C

    Texto A

    Texto B

    Texto C

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 27

    HyperText Markup Language

    ! PJ?231 0A 63:?703. 2?A?E6: =6:6 0A6 9-E0E6 .90=6: 8062.0 A6?2 E?5X62c . rowspan@ 36A7-A 9.A . K6E.:?58?963?K. 8. 5MA1:. 81 9-E0E62 6 .90=6:C

    Texto A

    Texto B

    Texto C

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 28

  • 7/26/2019 Bsicos Html5 e JavaScript

    15/100

    !"#"$%

    $!

    HyperText Markup Language

    "n.:A0E4:?.2c ...

    ! D2 F.:A0E4:?.2 =1:A?31A 6 ?521:;?562 0$1C

    !

    O.5308.@ - 5191224:?. 0A6 E?5>06>1A 81 4;%5#(5./60J?E?6: =6:6 . =:.91226A153. 812212 A12A.2 868.2 ,1C>C@D*E*F;%5#(.0 \'\C

    ! [ ?A=.:3W59?6 8. 63:?703.2 name@ action@ method 1enctype21:4 1J=E?9?3686 A6?2 68?6531C

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 29

    HyperText Markup Language

    ! j153:. 8.2 F.:A0E4:?.2@ =.81A 21: ?521:?8.2 .2 K4:?.21E1A153.2 _4 9.5X19?8.2 81 .03:62 6=E?96;Y12@ 36?29.A. 7.3Y12@ 96A=.2 1 96?J62 81 31J3.@ %*A53 1,((3.41;

  • 7/26/2019 Bsicos Html5 e JavaScript

    16/100

    !"#"$%

    $%

    HyperText Markup Language

    ! S.3Y12c

    "(6A7-A - =.22LK1E F6U1: . A12A. 9.A 6 (*/buttonG9.A671:30:6 1 F19X.H 02658. .2 A12A.2 63:?703.2@ 1 63-8?2=.5?7?E?U658. A6?2 =.22?7?E?86812 1A 31:A.2 81F.:A636;C@ 81F?5?: 0A6 ?A6>1A 9.A. 2158. 0A 7.3

  • 7/26/2019 Bsicos Html5 e JavaScript

    17/100

    !"#"$%

    $i

    HyperText Markup Language

    ! n?9X1?:.2c

    ! PJ=E?96;0A62 6E31:6;Y12 9.A 6 K1:2

  • 7/26/2019 Bsicos Html5 e JavaScript

    18/100

    !"#"$%

    $k

    HTML & XHTML

    ! [=126: 81 _4 21 9.A1;6: 6 03?E?U6: . '()*! G1. p'()*! 1236: 1A F621 81 81215K.EK?A153.=6:6 . 69.A=65X6:H@ 69306EA1531@ 62 K1:2Y12A6?2 03?E?U6862 8. '()* 1 8. p'()* 6?5862

  • 7/26/2019 Bsicos Html5 e JavaScript

    19/100

    !"#"$%

    $#

    HTML & XHTML

    "D2 1E1A153.2 p'()* 3VA 81 21: 21A=:181K?86A1531 F19X68.2 G02658. 0A6 76::6 g/h@/0658. 5

  • 7/26/2019 Bsicos Html5 e JavaScript

    20/100

    !"#"$%

    &^

    Cascading Style Sheets

    ! [2 ;*4;*A5./ 4("6$ 4?:6A 9.A .?530?3. 81 21=6:6: 6 F.:A636;?56 0$186 206123:030:6@ 0A6 519122?8681 ?8153?F?9686 _4 1AA168.2 8.2 65.2 #^C

    ! [2 ONN 6E31:6A@ /0658. 5191224:?.@ 6

    F.:A636;?562 0$181 0A 25($C

    ! \6:6 6E-A 8?22.@ - =.22LK1E 76216: 0A 123?E.5.03:. 123?E. _4 1J?231531 1".0 6=:.K1?36: 6X?1:6:/0?6 81 6=E?96;.C

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 40

  • 7/26/2019 Bsicos Html5 e JavaScript

    21/100

    !"#"$%

    &$

    Cascading Style Sheets

    ! [ 3L30E. ?5F.:A63?K.@ 69306EA1531@ .81215K.EK?A153. - F1?3. 122159?6EA1531 6?58656 K1:2?56 '()*q

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 42

  • 7/26/2019 Bsicos Html5 e JavaScript

    22/100

    !"#"$%

    &&

    Cascading Style Sheets

    "50A F?9X1?:. 1J31:5. , 2158.@ 622?A@ =.22LK1E 6206 =6:3?EX6 =.: AME3?=E62 =4>?562 , 63:6K-2 86?521:;0?531 E?5X6 5. 9671;6EX.c C

    ! PJ91=3. 562 819E6:6;Y12 1A E?5X6@ 3.86 681F?5?;?:6 f K.E36 81 21E193.:12@

    /01 =.81A :1F1:?:T21@ 153:1 .03:.2@ 61E1A153.2 '()*@ 5A2@ 9E62212 1 =2108.9E62212C

    Redes e Sistemas Multimdia II

    3-May-16 CDM - RSM2 - 2015/16 43

    Cascading Style Sheets

    ! `A A12A. 8.90A153. =.81 31: K4:?62 F.EX6281 123?E.2@ =6:6 6E-A 86/01E12 /01 =.81A 21:81F?5?8.2 =.: 6E>052 1%304$%4C

    ! [ 2.7:1=.2?;

  • 7/26/2019 Bsicos Html5 e JavaScript

    23/100

    !"#"$%

    &Z

    Cascading Style Sheets

    ! O.5308.@ 6 03?E?U6;?562 81 0A 45($@ F69?E?3658.@ 81226 F.:A6@ 6>123

  • 7/26/2019 Bsicos Html5 e JavaScript

    24/100

    !"#"$%