Html coban

Click here to load reader

  • date post

    12-Apr-2017
  • Category

    Software

  • view

    311
  • download

    0

Embed Size (px)

Transcript of Html coban

  • Lp trnh Web

  • Mc tiu mn hc

    Cung cp cc kin thc c bn v thit k web

    HTML, CSS, JavaScript

    Tm hiu cc thnh phn c bn ca trang web

    Cc bc xy dng trang web tnh

    Xy dng & trin khai trang web tnh.

    S dng cng c thit k web ph bin nh

    Dreamweaver, v cc cng c h tr khc nh

    photoshop, flash

    2

  • Ni dung mn hc

    3

    Phn 1: kin thc c bn

    HTML (HyperText Markup Language)

    CSS (Cascading Style Sheets)

    Ngn ng JavaScript.

    Phn 2: cng c thit k web

    Dreamweaver

    Photoshop

    Flash

    Mt s cng c h tr thit k web khc.

  • Gii thiu mn hc

    Ging vin:

    ThS. Nguyn H Giang

    Cc mn dy:

    K thut lp trnh, CTDL & GT, OOP, Lp trnh Visual C++ &

    MFC, Lp trnh C# Desktop Application, LT Web Application

    ASP.NET, M ngun m (PHP & MySQL), CC&MT PTPM.

    Hng nghin cu:

    Data Mining, Fuzzy Data Mining, Fuzzy Association Rule

    Mining

    Semantic Web Mining,

    Email: nguyenha.giang@yahoo.com

    4

  • Chng 0

    Cc kin thc c bn

    5

  • Mc tiu

    6

    Gii thiu m hnh 3 lp trong thit k web

    Cc khi nim v thut ng c bn v mng v

    mi trng web

    Cu trc v c php ca ngn ng HTML

    C php v thuc tnh ca CSS (chun nh

    dng cch trnh by ca trang web)

    Tng quan v ngn ng script, c php, cch x

    l s kin v thao tc trn i tng HTML ca

    ngn ng JavaScript.

  • M hnh 3 lp trong TK Web

    7

    Lp ni dung

    Cung cp ni dung thng tin cho

    ngi truy cp.

    Bao gm cc vn bn, hnh nh,

    cc lin kt

    Ni dung ny s c t chc

    theo cu trc ca ngn ng nh

    du siu vn bn nh HTML,

    XHTML

  • M hnh 3 lp trong TK Web

    8

    Lp trnh by Quy nh cch trnh by trang

    web. Lp ny nh ngha cc nh dng hay kiu mu cho cc thnh phn trong trang web.

    Cc nh ngha ny c lu trong mt file ring theo c php ca chun nh dng CSS

    Lp hnh vi Cho php thc hin mt s hnh

    vi/thao tc trn cc thnh phn ca trang web thng qua ngn ng script (JavaScript, VBScript)

  • M hnh 3 lp trong TK Web

    9

    Mt s u im ca m hnh

    Share resources

    Dng chung ton b file CSS hay JS cho ton b cc

    trang web trong website.

    Khi thay i trn tp tin ny th ton b site s c i

    Faster downloads

    Khi user truy cp trang web, cc CSS v JS ch ti ln

    truy cp u tin, trnh duyt s cache li cho ln sau.

    Multi-person teams

    Thun tin cho vic phn chia cng vic.

    Cc thnh vin trong nhm s c phn cng theo tng

    lp m hnh. Do cng vic cc lp c th lm ng

    thi.

  • Cc khi nim & thut ng c bn

    10

    WWW (World Wide Web): mng ton cu cc

    my tnh s dng Internet trao i ti liu

    web.

    Protocol: l tp hp cc quy tc c thng nht

    gia hai my tnh nhm thc hin trao i d

    liu c chnh xc.

    Cc giao thc thng dng: TCP, HTTP, FTP, SMTP

    Web page: mt ti liu (thng l HTML) c

    thit k phn phi trn mi trng web.

    Web site: l tp hp cc web page c lin quan

    n 1 cng ty hay c nhn

  • Cc khi nim & thut ng c bn

    11

    Home page: l web page c mc cao nht, gi l

    trang ch ca website.

    IP Address: mt con s xc nh duy nht cho

    mi my tnh trn Internet

    VD: 192.168.10.1

    Domain name: tn xc nh website

    VD: www.huflit.edu.vn

    DNS (Domain name service): mt chng trnh

    chy trn server, chuyn tn min sang IP v

    ngc li.

  • Cc khi nim & thut ng c bn

    12

    ISP (Internet Service Provider):

    Nh cung cp dch v Internet (cung cp cc dch v

    truy cp Internet v ni lu tr web).

    Web host:

    Mt web server cung cp dch v lu tr cho web site

    ca cc cng ty, t chc hay c nhn.

  • Cc khi nim & thut ng c bn

    13

    URL (Uniform Resource Locator): Mt a ch web, l

    mt chun xc nh cc ti liu (trang) web trn

    Internet.

    http://www.huflit.edu.vn:8080/khoacntt/news.php?id=216&p=1#Phan1

    Giao thc

    Tn min

    cng

    Th mc

    Tp tin

    Tham s

    Tn v tr trong

    trang web

  • Cc khi nim & thut ng c bn

    14

    Port: l con s xc nh knh nhp/xut c s

    dng bi mt ng dng Internet.

    Mt my server c th cung cp nhiu dch v,

    do cn c c ch phn bit, gip client

    khai thc ng dch v cn thit.

    Hai dch v khc nhau phi chy trn hai cng

    khc nhau.

    VD: web server thng dng cng 80, ftp server

    dng cng 21, smtp server dng cng 25

  • Cc khi nim & thut ng c bn

    15

    Web client (Web Browser): l phn mm dng

    truy cp v hin th ni dung trang web.

    Mt s web browser thng dng nh: IE, Firefox,

    Opera, Safari, Chrome

    Web server: mt my tnh phn phi dch v v

    thng tin cho my tnh khc.

    Mt s web server thng dng: IIS, Apache,

    Tomcat

  • Cc khi nim & thut ng c bn

    16

    Server: cha d liu, ti nguyn v dch v cho

    php my khc c th khai thc v truy cp.

    Mt my ch c th dng cho mt hay nhiu mc

    ch.

    Tn my ch thng c gn vi mc ch s dng

    VD: Web server, File server, Mail server

    Client: l my tnh dng kt ni v khai thc

    cc ti nguyn trn my ch

    Vic kt ni client vi server v vic khai thc dch

    v ca server to nn m hnh Client/Server

    Mt my tnh va c th l server va l client.

  • Cc khi nim & thut ng c bn

    17

    Trang web tnh:

    Cha ni dung c nh (thng l HTML, cp nht

    ni dung phi cp nht trc tip trn HTML).

    Khng cho php s dng tng tc, cp nht d liu

    trn trang web.

    Mt trang web cha cc hnh nh chuyn ng cng

    c th l trang web tnh!

    Trang web ng:

    Kt hp HTML v m lnh.

    M c thc thi trc tip trn server, gi kt qu l

    HTML v ngi s dng.

    C kh nng tng tc vi ngi s dng!

  • X l yu cu vi web tnh

    18

  • X l yu cu vi web ng

    19

  • Chng 1

    Ngn ng HTML

    20

  • Ni dung

    21

    Gii thiu ngn ng HTML

    Cu trc tng qut trang HTML

    Cc th HTML c bn

    Cc k t c bit

    Thit k bng

    Chia khung

    To form

  • HTML - nn tng ca web

    22

    HTML: HyperText Markup Language ngn ng

    nh du siu vn bn.

    Do Tim Berner-Lee pht minh v tr thnh

    ngn ng chun to trang web.

    HTML dng cc th (tags) nh dng d liu

    To khung/bng cho trang web

  • Cu trc tng qut trang HTML

    23

  • Cc th HTML c bn

    24

    Cc thnh phn c bn (tag, element, property)

    Cc th HTML c bn.

    Th nh dng trang:

    Th nh dng vn bn: , , , ,

    Th to siu lin kt (hyperlink):

    Th nh dng danh sch: , ,

    Th chn hnh nh:

  • Cc thnh phn c bn

    25

    Th (tag): l mt tp hp k hiu c nh ngha

    trong HTML c ngha c bit.

    th bt u bi ""

    th m:

    th ng:

    Phn t (element): c th bao gm th m, th

    ng v ni dung bn trong cp th m, ng.

    C hai loi phn t trong HTML

    Phn t cha ni dung: bao gm th m v th ng

    VD: Ni dung

    Phn t rng: bao gm mt th

    VD: c th vit l hoc < br />

  • Cc thnh phn c bn

    26

    Thuc tnh: mi th c th mt hay nhiu thuc

    tnh i km. Thuc tnh c nhp ngay trc

    ngoc ng > ca th m.

    C th c nhiu thuc tnh trong mt th, cc

    thuc tnh phn cch nhau khong trng.

    Cc gi tr thuc tnh c th t trong , hoc

    khng c.

    Nu gi tr l chui k t c khong trng bn

    trong, bt buc phi dng hay bao chui

    li

    VD:

  • Th nh dng trang

    27

    Mt s thuc tnh ca th body

  • Th nh dng vn bn

    28

  • Th nh dng vn bn

    29

  • Th to hyperlink

    30

    Hyperlink: cho php ngi dng c th duyt t

    trang web ny n trang web khc.

    Gm 3 phn:

    Ngun: cha ni dung hin th khi user truy cp n,

    c th trang web khc, mt on film, mt hnh nh

    hoc hp thoi gi email.

    Nhn: c th l dng vn bn, hnh nh ngi

    dng kch vo. Nu l vn bn th thng c gch

    di.

    ch n (target): xc nh v tr ngun hin th.

  • Th to hyperlink

    31

    C hai dng lin kt:

    Internal hyperlink: l lin kt vi cc phn trong

    cng mt ti liu hoc lin kt cc trang trong cng

    website.

    External hyperlink: l lin kt vi cc trang trn

    website khc

    C php:

    Nhn

    URL: a ch ca trang lin kt

    Nhn: C th l dng text hoc hnh nh hoc mt button

  • Th to hyperlink

    32

    - - - - -

    - -

    - - - - -

    - -

    - - - - -

    - -

    - - - - -

    - -

    - - - - -

    - -

    - - - - -

    - -

    - - - - -

    - -

    - - - - -

    - - - - - - -

    - -

    - - - - -

    - -

  • Th to hyperlink

    33

    Dng URL tng i lin kt n cc trang

    trong cng mt website

    V d:

    Using links

    Open Page1

  • Th to hyperlink

    34

    Dng URL tuyt i lin kt n cc trang

    trong website khc

    V d:

    Link

    Trang google

    Trang Yahoo

  • Th to hyperlink

    35

    Lin kt n cc phn trong cng trang:

    Nu ni dung trang web qu di th nn to

    bookmark, gip ngi nhanh chng chuyn n

    phn ni dung c th no .

    Gm hai bc

    To bookmark:

    To lin kt n bookmark

    Tiu Ni dung phn vn bn

    Nhn ca lin kt

  • Th to hyperlink

    36

    Lin kt n cc bookmark trong trang khc:

    V d: trang main

    M