Bi tp Web1 Module 1: S dng cc Tag HTML c bn

1. To trang web Resume.html, s dng cc tag , , , , v cc tag nh dng trnh by trang web, tham kho yu cu chi tit trang 33 trong gio trnh vi file hnh v d liu km theo trong th mc Module1\Bai1.txt. Ngoi ra sinh vin c th s dng hnh lm nn cho trang.

2. To mt website Beethoven.html gm 4 trang lin kt, mi trang s dng hnh lin kt n trang sau v trang trc n. S dng cc tag , , , , trnh by cc trang web trong website, t chn hnh nn cho cc trang. Tham kho cc bc thc hin v yu cu nh dng t trang 36 37

Biu tng lin kt

3. Trnh by trang web Euler.html vi yu cu v cc bc thc hin tham kho trang 38 (Gio trnh)

4. Trnh by trang web Chester.html vi yu cu chi tit tham kho trang 40 (gio

trnh)

Module 2: Links Image Maps

1. M li trang web Resume.html to cc lin kt anchors theo hng dn chi tit t trang 4551

2. M li trang Resume.html v nhp thm ni dung sau y vo cui trang, sau to lin kt cho cc mc:

References n trang Reference.html. Comments on my work lin kt n trang Comments.html. Go to Colorado State link n trang www.colostate.edu

Other Information References

Comments on my work

Go to Colorado State

Interested? Contact Mary Taylor at mtaylor@tt.gr.csu.edu

Ni dung ca 2 trang Refer.html v Comments.html nh sau:

Link n trang Resume.html

Link n trang Refer.html

To lin kt gia 3 trang theo m hnh:

M trang Comments.html, to thm 2 lin kt n trang Resume.html v trang Refer.html:

View My Resume lin kt n trang Resume.html

References lin kt n trang Refer.html

M trang Refer.html, to thm 2 lin kt n trang Resume.html v trang Comment.html:

3. To trang web Expo.html nh hnh mu bn di, cc yu cu lin kt v nh dng

tham kho gio trnh t trang 87127, cc file d liu km theo trong folder

Module2\Expo.html. Vi yu cu lin kt nh sau:

Bryd Hall (Text v Image Maps) lin kt n trang Bryd.html

Mitchell Theatre (Text v Image Maps) lin kt n trang Mitchell.html

Astronomy Classrooms (Text v Image Maps) lin kt trang Brinkman.html

Resume.htm R

efe

r.h

tm

Co

mm

ent.

htm

4. To trang web Jaction.html, dng image maps lin kt trang theo hng dn

trang 132 ca gio trnh, cc file lin kt trong th mc Module2\bai3

Image Maps

Image Maps

5. To website SFSF, s dng d liu v hnh trong th mc Module2\bai5, tham kho

cc yu cu v cc bc hng dn trang 132-134 (case 2)

Image map1: link n trang Forrest.html

Image map2: link n trang Charnas.html

Image map3: link n trang c Cc trang Forrest.html, Charnas.html, Charnas.html nh dng tng trang theo yu cu

trong gio trnh.

6. To Web menu cho Kelseys Dinner, s dng image maps theo hng dn v yu cu

nh dng trong gio trnh t trang 135-136 (case 3), d liu v hnh trong th mc

Module2\bai6.

Breakfast tr n Breakfst.html

Lunch tr n Lunch.html

Dinner tr n Dinner.html

Image Maps

Module 3: Table

1. To mt trang web MAA.html cha Text Tabale s dng tag v phm

spacebar, tham kho gio trnh trang 144, d liu v hnh trong th mc

Module3\bai1.

2. S dng d liu trong cu 1, to li mt trang MAA1.html, s dng v

thuc tnh rowspan, colspan.

3. Thit k trang web The Gargoyle.html, s dng lng nhau v cc tag

hc: , , , tham kho phn hng dn v yu cu nh dng

trong gio trnh t trang 169-182

4. To trang web Avalon Books Calendar theo yu cu nh dng trong gio trnh

trang 188.

5. To trang web Dunston.html, s dng lng nhau. Cc yu cu nh dng

v cc bc thit k

tham kho trang 190-

191 ca gio trnh. D

liu v hnh trong th

mc Module3\bai5.

Module 4: Frames

1. To mt website Colorado.html s dng frameset c dng:

Logo.html

Link.html Hompage.html

Our Philosophy.html

Climbing Lessons.html

Petit Grepon.html

Lumpy Ridge.html

North Face.html

Kiener's.html

The Diamond.html

Eldorado.html

Cc bc thc hin tham kho gio trnh t trang 215 n trang 221. D liu v hnh

trong th mc module4\bai1.

2. Thit k website s dng frameset, hnh v d liu trong th mc Module4\bai2,

cch thit k tng t bi 1.

3. Thit k website s dng Frameset v image maps, Frameset c dng

Logo 4 trang lin kt

Image Maps

Image maps

Image maps gm 4 vng vi 4 mu, khi click vo mi vng s link n mt trang vi mu tng ng trong image maps. D liu v hnh nh trong th mc Module4\bai3. Cc bc thit k tham kho gio trnh trang 233-234 4. Thit k website Travel Scotland.html, s dng Frameset v image maps. D

liu v hnh trong th mc Module4\bai4. Cc bc thit k v yu cu nh dng tham kho gio trnh trang 234-235

5. Thit k website Sonnet s dng Frameset. D liu v hnh trong th mc

Module4\bai5. Cc bc hng dn v yu cu lin kt tham kho gio trnh trang

236-237.

Image maps

Module 5: Form

1. To trang Register.htm, yu cu v cc bc thit k tham kho gio trnh 249

n 272, hnh v d liu trong th mc Module5\bai1.

2. Thit k trang form Online Classifield theo yu cu v hng dn chi tit trong

gio trnh trang 286-287

3. Thit k trang form nh hnh bn di, cc yu cu v hng dn tham kho gio

trnh trang 288 289, hnh v d liu trong th mc Module5\bai3

4. Thit k trang form Registration, tham kho yu cu nh dng v hng dn

trong gio trnh trang 290-291, hnh v d liu trong th mc Module5\bai4.

Module 6: Cascading Style sheet (CSS)

Yu cu nm vng cc kin thc c bn v style:

Loi style v cch to v s dng: Inline style, internal style, external style.

Cc style nh dng c bn v font ch:

o nh dng: font- size c nhiu loi n v (in, pt, em), tham kho trang 312.

o Khong cch gia cc k t: letter-spacing, gia cc dng line-spacing.

o Canh l vn bn: text-align (left, right, center, justify), vertical-align.

o Tht l: text-indent

o Thuc tnh c bit ca vn bn: Text-transform (none, capitalize, uppercase,

lowercase)

nh dng mu nn v hnh nn cho trang:

o Mu nn: background-color

o Hnh nn: bacground-image:url(image), bacground-position (325)

o Thuc tnh ca background: bacground-repeat

Cc nh dng cho list: (trang 330-331)

o List-style-position (inside, outside)

o List -style: circle url(image)

nh dng link:

o A{text-decoration}

o A:visited

o A:link

o A:active

o A:hover

Id v class: trang 335

o Class: .classname{style attribute and value}

o Id: #idname{style attribute and value}

Cch s dng tag v

nh dng Box:

o Cc tag s dng nh dng Box: , , , , ,

, , , (Trang 343)

1. Dng style sheet thit k website sau y gm 5 trang: Astro.htm, Chem.htm, Electtxt.htm, Engtxt.htm, Physicstxt.htm . Cc bc thc hin tham kho gio trnh t trang 299-352. Cc trang cn li thit k tng t nh trang Astro.htm

D liu v hnh nh trong th mc Module6\bai1. Tp tin style sheet:

BODY {

color:green;

background: white url(Draft.jpg) no-repeat fixed center

center

}

H1, H2, H3, H4, H5, H6 {

font-family: Arial, Helvetica, sans-serif

}

ADDRESS {

font-size: 0.9em;

font-style:normal;

text-align:center;

text-transform:uppercase

}

BLOCKQUOTE{

background-color:silver

}

UL {

list-style:circle url(Apple.jpg) outside}

UL B {

color:rgb(155,0,0)

}

A {

font-size: 0.9em;

color-green

}

A:hover {

color:red;

text-transform:uppercase;

font-weight:bold

}

.Special {

color: rgb(153,102,6);

font-weight:bold

}

DIV.Article {

padding: 0.5em;

border-style: solid;

border-width: 2px;

background-color: rgb(252,221,163);

width: 250px;

float:right

}

2. Dng style sheet thit k trang web StuffShop nh hnh bn di. Cc bc hng dn v yu cu nh dng tham kho gio trnh t trang 355-356. D liu v hnh trong th mc Module6\bai2.

3. Dng style sheet thit k trang web M.Lees nh hnh bn di. Tham kho phn hng dn v cc yu cu trong gio trnh, trang 356-357. D liu trong th mc Module6\bai3.

4. Dng style sheet thit k trang web ScrapBooks nh hnh bn di. D liu v hnh trong th mc Module6\bai4. Sinh vin t thit k. Tng t bi 3.

5. Dng style sheet thit k trang web nh hnh bn di, sinh vin t thit k, p dng cch lm ca cc bi trn, d liu v hnh trong th mc Module6\bai5.

Module7: Dreamweaver

S dng Dreamweaver thit k li cc trang web t Module 1-6.

Module 8: Javascript

1. Dng Dreamweaver thit k trang web NPN.htm, vi cc yu cu sau: Dng style sheet nh dng cc header, v cc link khng c gch chn, khi a

chut ngang th cc link chuyn sang mu . Dng Javascript vit hm tnh s ngy cn li tnh t ngy hin hnh ca my n

ngy Noel. Cc bc tnh ton tham kho gio trnh, trang 365 n 387. D liu v hnh nh trong th mc Module7\bai1

2. Thit k trang web Dinner Menu, hin th menu trn WWW, mc b thiu trong menu l todays special. Mi ngy trong tun c mt special khc nhau. khi phi cp nht trang mi ngy, bn hy s dng Java Script hin th nhng special c trong ngy hin ti, nhng special hng ngy hin th di dng ch in nghing. Cch thc hin tham kho gio trnh, trang 400-402. D liu v hnh trong th mc Module8\Bai2.

3. Thit k trang web Mark Twain nh hnh bn di, cc yu cu v hng dn chi tit tham kho gio trnh, trang 402-404, d liu trong th mc Module8\Bai3

4. To trang web Trigonometric tnh sin v cos ca cc gc. Tham kho hng dn trong gio trnh trang 405.

5. Thit k trang web AvalonBook nh hnh bn di, tham kho hng dn trong gio trnh, trang 407.

Module 9: Javascript Object Event 1. Thit k trang form nh hnh, vi cc yu cu nh sau:

Khi load form th Today is s hin th ngy hin hnh theo nh dng d/m/yyyy v du nhy nhy n name.

Trong mc Physician, nu ngi dng chn other th khi a tr ra ngoi s xut hin thng bo yu cu nhp Name.

Nhp gi tr vo cc Activity, Pulse, Grimace, Appearance v Respiration, chng trnh kim tra gi tr nhp t 02, nu sai chng trnh hin th thng bo nhp li. Khi nhp gi tr trong tng th Total s tnh tng gi tr cc nhp.

Tham kho cc bc thc hin v yu nh dng trang 427-450)

2. Tao trang web UB Computing tnh gi ca mt my tnh khi ngi dng chn cc ty chn v cu hnh. Tham kho cc bc thc hin trong gio trnh t trang 456-457, hnh v d liu trong th mc Module9\bai2.

3. Thit k trang Color Picker nh hnh bn di, tham kho yu cu v cc bc hng dn trong gio trnh, trang 459-460.

4. To trang web Mortgage calculate khch hng c th s dng kim tra s tin tr hng thng cho ti sn th chp, nh hnh bn di. Tham kho cc yu cu v cch tnh ton trong gio trnh, trang 460-461.

Module 10: To Style cho website

Module ny gm cc bi tng hp, i hi sinh vin phi nm tt c cc kin thc trong 9 module trc.

1. To website FrostiWear nh hnh, tham kho yu cu v cc bc hng dn trong gio trnh, trang 464-467. Hnh v d liu cho cc trang trong th mc Module10\bai1.

2. To mt website Mayer Photography

y l trang u ca website Mayer Photography. Yu cu v cc bc thit k cc trang cn li v to lin kt gia cc trang trong website tham kho trong gio trnh, trang 471 475. Hnh v d liu trong th mc Module10\Bai2