Bai tập thiết kế web bằng HTML tai liệu

Trang 1

Bài tập HTML 1 (Cơ bản, định dạng) 1/ Headings.html (Sử dụng Le] e «+ +

Heading) Thi is Heading I

3 Exwercise :: Headings - Internet Explorer I„ |HỈ x| ˆ | File Edit View Favorites — Help | This is H eg din g ?

¢ % @ »

| Back Forward Stop to

| Address |£) A:\headings.htm | @ Go This is Heading 3 es ‘ F This is Heading 4 This is Heading 1 a ; This is Heading 5 This is Heading 2 This is Heading 6 This is Heading 3 s This is Heading 4 #ì Done |_ |- | My Computer 4 This is Heading 5 This is Heading 6 B Ế Done [| [| My Computer 4 2/ HeadingCenter.html (Phối hợp các tag 3/ Alignment.html (Phối hợb các Tag 4/ Emphasis.html This is Heading 1 This is Heading 2 This is Heading 3 This is Heading 4 This is Heading 5

This ts all about formatting

We know that the mternet is a wonderful place to weit but why do some thimgs on a web page catch our eye more than others It is because of the formaffing and the emphasis of different

elements to a page Bold tafe underline 22 and strong are all tags that can be used for this task

Trang 2

Bài tập HTML 2 (Cơ bản, định dạng)

1/ trungtamtinhoc.html

Bài tập - hiển thị lên trình đụ ;ét nĩi dụng sau :

ĐẠI HỌC QUỐC GIA TP HCM

ĐẠI HỌC KHOA HỌC - TỰ NHIÊN

TRUNG TÂM TIN HỌC TRUNG CẤP ĐỒ HỌA ĐA TRUYEN THONG Liên hệ : 227 Nguyễn Văn Cử A5 Tel : (08) 8887756 hffp⁄ˆWww.czc hemu.edU vn 2/ ngonnguhtmi.html Bai tap |: The hiện lén trinh duy ét noi dung sau: NGON NGU HTML

(Hyper teat Markup language )

* Cau tric trang HTML :

<html>

<head>

<tithe> tidu dé trang </title>

</head>

<body bacolor= “#445566” temt= “#aaccBBˆ> nồi dung hiển thị tự tìm tài li@u tham khảo!

</body>

</html>

“Các thé lénh: chit dam <Ii> chữ nghiêng chữ gạch chan “Liên kết :

<a>

Lop lap tinh vien quéc té Tata intotech Mon ky thudt thet ké web co bin

Trang 3

Bài tập HTML 3 (Image) 1/ Image1.html 5 E:VIOS0GD_TKWEB_?2007\wdminhhoahinh.h†m - Microsoft Internet Fxplarer eles File Edit View Favorites Tools Help Cy : 1 & : r : 2 9 © DAG Px proms @ 8 e- WA s Address | @°) E:\HOSOGD _TKWEB_Z2007\wdminhhoathinh.htm vị Go Links ?° IMAGES

— A paragraph with an image The align attribute of me the image is set to "left" The image will float to the

left of this text

A paragraph with an image The align attribute of the image is set to "right" The mage will float to the right of this text €) Done rẻ My Computer “ 2/ Image2.html

Hướng daan: Mod taap tin Image.html, theam vago dòng lệnh

ˆ] Exercises ::Tu duy - Microsoft Internet Explorer

Beck | otal Stop Refresh Home | Search Fa History

| Address [2 E-\BT Dream eaversB ackground htm =| eGo \| Links ”

| y ~@~ 9 | Search Web [-|| (Wh Bookmarks attempting to retrieve buttons from Yabeol

he, hk -

cs aes =

TƯ DUY

Con ngưỡi là động vật cĩ khả năng suy nghĩ Nhưng cĩ

khã năng suy nghĩ khơng tự động dẫn đến biết cách suy

nghĩ Sự phát triển ngày càng địi hỗi mỗi người phải

Trang 4

Bài tập HTML 4(Bulleted)

1/ Unordered.htn

a Exercise :: Definition lists - Microsoft Internet Explorer

| Eile Edit View Favorites Tools Help

Address je) E:s\BT DreamWeaver efinition htm 2/ Ordered.html | File Edit View Favorites Tools »| | 4= Back ~ = + & | Address |£} A:\ordered.htm Unordered list + Item 1 « [tem 2 e Item 3 e ltem4 Ordered list 1l Item 1 2 Item 2 3 Item 3 4 Item 4 =] @ Go || Links » > - © Search Q Favorites ff History B@ ” Home

= Back Fonivetal Stop Rehtesh

(Search > Edit | | Google | - Yahoo! + Ask Jeeves More ? dj — » Definition List ot — Pixel a dd —_,

Short for picture element A pixel refers to the small dots that make up an image on the screen Pixel depth refers to the number of colours which may be displayed

Resolution

The quality of the display on a monitor The higher the resolution, the sharper the image The number of pixels that can be displayed on a screen defines resolution Scanner

Trang 5

4/ Chuongtrinhdaotao.HTML CHƯƠNG TRÌNH ĐÀO TẠO THIẾT KẾ WEB e Ngdn ngcr HTML & FrontPage « XỬ lự ảnh & Thiết kế giao diện PhotoShopcs e DreamWeaver Mx,

e Khai thac va Quan tri Domain,Hostting

e Ngén ngtfkich ban JavaScript

Mại théng tin chi tiét xin liém hé: Van oheang gido vir TelG8.8564258, Giaovu@neman vw

5/chuongtrinhthietkeweb.HTML

CHƯƠNG TRÌNH ĐÀO TẠO THIẾT KẾ WEB

Ngơn ngữ HTML & FrontPage

Xử lý ảnh & Thiết kế giao diện PhotoShopCS DreamWeaver MX, Khai thac va Quan tri Domain,Hostting Ngơn ngữ kịch bản JavaScript in BW Ne 6/ chuongtrinhnganhwebsite.HTML 7) Tạo file tonghop.html sau:

File Edit Yiew Favorites Tools Help

© Back a A I*Ì I#) đa /© Search Se Favorites @) media €4) ya] = | = |] ~ Search the Web | # Search |- Address |) Esibt_thietkeweb\)6t HTML trang 1 1.btrr] The great American Novel I Introdution 1 Boy's Childhood 2 Girl's Childhood I Developement 1 Boy meets Girl

2 Boy and Girl fall in love 3 Boy and Girl have flight I Climax

1 Boy gives sirl ultimatum

a Girl can't believe her ears

b Boy is indignant at Girl's indignance 2 Girl tells Boy to get lost

Denouement

Epilogue

Trang 6

Bài tập HTML 5 (Liên kết) 1/ Tạo tập tin Link.html : Tạo các liên kết đến các bài đã tạo phần trước ¬ Exercise :: Links to my files - Internet Explorer Ele Edit View Favorttes Tools Help Ea = + @ FF

Back Forward Stop Refresh Home

| Address [4 A:Slinks2.htm xị (Go =| These are the pages I have created Exercise — Headines Exercise — Centenng Exercise — Ernphasis Exercise — Links #] | | - le) Hy Campiter b 2/ Tao tap tin Search html dé xây dựng trang Web sau ; File Edit View Favorites Tools Help |

| Back Forward Stop Refresh Home Search Favorites History

[Were s|\@&O-.w- wm -g-O-e-M-M-M- »

| Address [) A:\search htm | @Go IR — * Search Engines Click on the following to call up the search engime Gooole search

http:/www.google.com for Google

> htto:/\www.altavista.com for Altavista

e http:/Awww.Yahoo.com for Yahoo |

Trang 7

Bài tập HTML 6 — Liên kết đến trong một trang

1/ chuongtrinhTKWeb.html

Phan |: HTML

Phan Il: Java Script Phan Ill: Photoshop Phan IV: Flash Phan V: Hinh anh

Phan I: HTML

Giới thiệu về các thẻ trong HTML dùng để thiết kế và tạo trang Web, Nội dung gồm các phan sau:

e_ Thẻ tạo một file định dạng HTML e Thẻ định dạng Font chữ và đoạn văn

e Thẻ làm việc với danh sách

e Thẻ tạo liên kết

e Thẻ làm việc với bang e The lam viéc voi khung e Thẻ tạo Form

Phan Il: Java Script

Giới thệu về cách nhúng các đoạn mã Java Script vao trong mot trang Web,

Phan Ill: Photoshop

Giới thiệu cách sử dụng phần mềm Photoshop 8 để chỉnh sửa một hình ảnh, gồm các nội dung sau: | Téng quan phan mém Photoshop

II Cấu trúc một ảnh màu và độ phân giải

Ill Một số thao tác cơ bản

IV Lớp và thứ tự lớp

V._ Mơt số phương pháp tách ảnh và chỉnh sửa ảnh

Phần IV: Flash

Giới thiệu cách sử dụng phần mềm Macromedia Flash 8 để tạo các đoạn phim Flash đơn giản để cĩ

thê nhúng vào trang Web, gồm các nội dung sau:

Giới thiệu

Cơng cụ trong Flash

„ Biên tập đối tượng

Lớp và các thuộc tính cơ bản = Khung hình

Trang 8

Bài tập HTML 7 — Liên kết tơng hợp

1/ kythuatvientinhoc.html

LE thuat wien tin hoc 2.Chuyén neanh Website K¥ thuật vién tin hoc Hoc phan I Hạc phần I Hoc phan TIT Tt = Hoe cu

; Téng quan cẩu trúc may tính 5 Hệ điều hành Wind can I Tín Hẹc Văn ZB Phịng 2 MicroSoft Excel I Tin Hee Quan Ly 1 Microsoft Access 2 kiicroseoRl PowerPoint Đầu trang Yêu cầu:

e Thiết kế nội dung theo mẫu

e Tại mục 2 tạo liên kết thực hiện mở 1 trang ChuongTrinhDTWeb.HTML (Cùng cửa số)

Trang 9

Bài tập HTML 8 (Table) 1/ Horizontal.html @ E:\HOSOGD_TKWEB_2007\dminhhoa\LIST.HTM - Microsoft Internet Explorer [E ]|[E|J[X “

File Edit View Favorites Tools Help

<<) ch 3 | >] F- đa Je Search Sie Favorites & @®- Se [sa] = =

Address |) E:IHOSOGD_ TKEWEB_20071dminhhoa1LTST.HTM vi Go Links *” ˆ^ TTunnbered hat: Roman numbers list: 4 1 Apples I Apples 2 Bananas Tl Bananas 3 Lemons TW Lemons 4 Oranges 1V Oranges Letters list: Lowercase Roman numbers list: A Apples 1 Apples B Bananas i Bananas C Lemons nm Lemons DD Oranges w Oranges Lowercase letters list: UnOrder lst: a sipples =» Apples b Bananas =» Bananas c Lemons =» Lemons d Oranges = Oranges - a 3 1 Done s My Computer 2/ Table1.html

E | Example :: All About Html - Internet Explorer

We have a number of items for purchase below is a list of available items

| Ttem § Description Price | Availability

CD-ROM (CD-Rom OT DASE OR $28.75 2-3 day by post based Ebook the book

The Ultmat FANS Tshirt with ourlogo 23.90, 71719817 sui6 oo C tly out of

T stock

#Ì Done | | My Computer A

3/ Table2.html

We have a number of items for purchase Below is a list of a vailable items

Trang 10

4/ Table3.html (Tables with links)

| File Edit View Favorites Tools Help |

| = Back + = ~ & 2] 4 | @QSearch (Favorites C4History | + 48 8

| Address |] A:\table2 htm x| @Go lai Files from Files from Session |Files from Session Session 2 3 4 headin 83 EHETCISE images.htm unordered htm

center alion exercise images? htm ordered htm emphasis exercise | definition htm lint:: exercise 1 | table 1 htm line § Exercise 2 | = [x] IẼ] | _ My Computer 4 5/ Table4.html

KET QUA HOC TAP

Lê Thanh Xuân 1950 8,5 Giỏi Phan Thế Hạ 1985 6.5 Khả

Tran Hoai Thu 1986 95 Xuất Sắc

Trương Lưu Đơng 1984 6.0 Trung Binh Luu The Mac 1985 45 Kem

Trang 11

1/ Speedcompany.html Middle Age Artd What do I do wath gargoyle About Gargoyles is month Middle Age Arts intro ducts the Gargoyle

Don't think you nedd a gargoyle ? Think agam gargoyle are useful as

Collection I'm e Bird baths Ither Collection really excited e ‘Wind chinnes

about that new * Pen holders set of classical figures e Paperweights

e Bookends

e Collection contains fatthful

reproductions of gargoyles Profile of the Artist

from some of the famous

cathe drais od Europe, This month's artist is Machael including Notre Dame, Cassin Michael has been a Rheims, and Watwick Castle professional

All reproduction are done sculpter for ten with exacting and lowng detail years He has

won numerous

E collection also contains awards, including orginal works by noted artists the prestigious

Trang 12

2/ Diemdulichngaytet.html SO OO FAD #7; đ@â 3-*%$ B-Ljỉ W Ry - 2 * _ MỘTSƠ ĐIỂM DULICHCHO BẠN TRONG NGÀY TẾT — Sa) e Di tích lịch sử, văn hố e Thang cảnh e Du lich van hoa Di tích lịch sử, văn hoa

Chùa Bửu Phong

4 Xị trí: Chùa Bửu Phong nằm trên ngạn núi Bữu Long, thuộc phường Bửu Long, Tp Biên Hịa, tỉnh Đồng Mai

Đặc điểm: Chùa Bửu Phong là ngơi cỗ tự ru phang cố kính, cú những pho tượng với những nét điều khắc đặc biệt Á Đơng

Mộ cĩ Hàng Gịn

, “Vi tris MG cỗ Hàng Gàn nằm ữ độ cao 250m vỗ phía tây tinh lộ 2 (Long Khanh di Ba Rịa), cách thành phố Biên Hồ BDkm, thuậc xã Xuân Tâm, huyện xuân Lậc, tĩnh Đơng Nai

Đặc điểm: Mộ cổ Hàng Gịn là di tích văn hấ đã được xếp hạng, tiểu hiễu cho nền văn hấ cỗ đại xuất hiện cách đây khậng han 2.500 nắm và cĩ quy mư nhất tại Việt Nam cịn được bão tổn đến ngày nay =

Thang canh

Vườn quốc gia Cát Tiên

éị trí: Cát Tiên là tên gọi một vùng đất nằm gon trong doan uén khúc của sing Đẳng Nai, thuộc địa phận của ba tĩnh Đẳng hlai, Hình Phước và Lâm

Đẳng

Đặc điểm: Tục truyền, nơi đây co nang tiên thường xuống hạ tới dé vui đùa và tận hưởng dùng nước trang mát, nãn được gũi là "Nam Cát Tiên” Đây là cơng trình khảo cỗ cĩ giá trị văn hố, lịch sử và tín ngưỡng lớn để cĩ thể xác định được sự tẳn tại, nguồn gốc của một vương quốc đã bị lãng quên hơn 1.300 năm

Khu du lịch Bửu Long - hị Long An

pg “Vitri: Khu du lịch Bửu Long - hỏ Long Ăn thuậc phường Bửu Long, Tp Biên Hoa, tinh Đằng Nai, cách trung tâm thành phố Bkrm

aa Bac diém: Cú thể nĩi hỗ Long Ấn là một bức tranh †hu nhỏ của Hạ Long Võ số vách đá soi bĩng trên mặt nước xanh tạo cho hồ vẽ đẹp hấp dẫn trong cử một cảnh sắc thiên nhiên mỹ lệ: núi can, hỗ rộng, hài hồ với các cơng trình kiến trúc nghệ thuật mang dấu ấn tồn giáo cũa nhiều thời đại

_

Khám phá dao O - Dong Trường

Du lich van hoa -

Lễ Kỳ Yèn

Thời gian: 1B - 17/ 1 âm lịch

Địa điểm: Đền thờ Nguyễn Trì Phương, phường Bữu Hịa, Biên Hịa, tỉnh Đẳng Nai

Đặc điểm: Lễ cúng Tiền hiền, Hậu hiển, lễ rước thần, dâng lễ vật cúng than và lễ tống đn, hát bội, múa

Design by:{ Your Name} E-

Trang 13

Bài thực hành HTML 10 (Form) 1 Dangnhap.htmi 2/ thamdoykien.html

PHIEU THAM DO Y KIEN

ĐĂNG NHẬP DIỄN ĐÀN Tên đăng nhập| 7” Ginh: @Mam ©Nh

Thững mục bạn thường quan tâm trên Internet

a ~ oo, : T Tin tức

lên đăng rhập: hyhien F Giả tí

Wat khan: “ el [_ Gĩc học tập 7 ™ Cae muc khac

Your first name: |

Trang 14

4/ Laythongtin.html = Untitled Document - Microsoft Internet Explorer | File Edit View Favorites Tools Help | a Kiểm tra dữ liệu Đằng nhập [Nguyễn Van A |Khoa Cong ngheé thơng tin [ru Chg Bal hoc su pham kỹ thuật hưng Yên Néi dung ghi chu: | laseeee | Visual Basic 7 Ngơn ngử lập trình: Z Visual Basic ™ Active Server Pages Giới tính: ec Tình trạng gia đình : Cc ¢

Chon File: | Browse |

Trang 15

5/ Dangkymail.html

Tao tén truy nhắp Yahoo! va tai knodan Mail mién phí để kết nỗi với nhteng ngveéi ban quan tam cfing nh dé xem tin tức bạn cản

Ten tai [Ho |[Tấn |

Giới tính

llqäy sinh |hlậy || - han Thang - | [Mam |

Cau hai bao mat 1 |- Chon mét- wỊ

Câu trã lời của hạn | |

Trang 17

Bài tập HTML 11 (CSS)

Dùng CSS, tạo trang menu.html như sau:

- Khi đưa chuột qua liên kết nào liên kết đĩ sẽ đổi màu

Trang 18

Bài tập HTML 12 (Frame-CSS)

1 Tao 3 rang con: Banner.html, menu.html, gopy.html Cach lam:

- Trang banner.html chwa hinh anh

- Trang menu.html: Chứa menu, thiết kế bằng css

- _ Irang gopy.html Chứa Form đĩng gĩp ý kiên 2 Tao trang chu: index.html

Trang 19

Bài tập HTML 13

Yêu cầu:

Trang web gồm cĩ 3 khung cĩ tên là : “Khungtren”, “Khungtrai”, “Noidung” Khoảng cách giữa các khung là 0,

“Khung trên”: Chèn 1 Tập tin ảnh làm Banner, Khoảng cách lề trái, phải khung=0, Khơng co thay đơi kích thước

“Khung trái” : là trang DMTin.HTML chứa 2 liên kết mở 2 trang tương ứng: “Tinkt.HTML” & “TinCT.HTML”

“Khung nội dung”: Hiện thị các trang được tạo liên kết từ khunbg trái Mặc định ban đầu hiện trang “TinKT.HTML”

Các trang thiết kế theo mẫu sau:

Khi Cllick liên kết: “Kinh tế” A — — 100 —_

Câm cố chứng khốn: Kênh tạo vốn cho nhà đầu tư? 4

Mới đầy UBCKhM đã qửi cũng văn đề nghị các cong ty chứng khoăn, ngàn hang

kiểm sốt chặt giao dich va cho vay cảm cỗ mua co phiếu, nhằm hạn chế rủi ro, “sœ - Giới chuyên mơn cho rằng, chưa cần thiết phải lo lắng, bởi chứng khốn tăng là

- dấu hiệu tốt và vẫn trang tầm kiểm sốt Then LIBCKNM, đển ngày 20-3 cá khẳng 500

13 triệu rổ phiếu các lnại đợc cảm rỗ với tổng giá trị khnảng 751 tỷ đồng Ủy ban

da co yéu cau phối hợp với Ngắn hằng Nhà nưiức để liên kết quản lý việc chỉ vay và cam cũ chứng khốn ở các ngàn hang thuang mai »> ựy "<< 150 600 V Khi Click lién két “Chinh tri ”

Lam viéc trong Bo online

widt lãnh đạo Sử Tài nguyễn - tiơi rường 8 Nha dat Hai Phịng đã "kêu": nếu khơng đàn tạn rán bộ gấp thì khơng than kịp quy trình lầm việc của Bộ nhất là án dụng triệt để củng nghé thong tin tong giải quyết cơng việc rỗ người, rỗ việc và

khua học

Ứng dụng cơng nghệ nhuần nhuyễn vào cơng việc

Ơng Mai ải Trực, Bộ trưởng BỘ Tải nguyên - Mơi trường (TMRIMTT}

Trang 20

Bài tập JAVASCRIPT

1/ Chonso.html

Tao giao dién nhu sau:

Radio Button Alert

Click on one of the radio butions to see a message Te 20a c Yêu cầu : Khi Click chuột vào Radio Button yhì thơng điệp (Message) tương ứng cho biết bạn chọn số nào? 2/ Thongdiep.html Tạo giao diện như sau: Button Alert Push this button to make a message appear MESSage | Yêu cầu: Khi Click chuột vào nút Message thì hiện lên câu chao bat ky 3/ chuyenlienket.html

Yêu cầu: Khi nhập vào liên kết (http://www.google.com.vn) thì Windows hỏi, nếu OK thì chuyển đến trang liên kết, nếu Cancel thì khơng thực hiện gì cả

hlicrosoft Internet Explorer xỊ

Trang 21

6/ mocuaso.html Viết chương trình link đến một trang Web khác trong đĩ cho phép tùy chọn các đối tượng Windows |http/a.cidnet.vn : URL Toolbar Location Directories status Menubar Scrollbars XU TT 1 1 145 Resizable Width Height =-RESET= 7/ kiemtrahople.html

Kiểm tra tính hợp lệ của thơng tin nhập vào:

Trang 22

BÀI TẬP JAVASCRIPT

Bai 1: matran.html

Viết chương trình nhập vào 2 số m(dịng),n(cột) (dùng hàm prompt dé nhập) Sau đĩ xuất ra trang

Web một Table theo dạng sau: Ví dụ (m=3,n=4) 11 12 13 14 21 22 23 24 31 32 33 34 Bai 2: danhsachsinhvien.html ; ;

Viêt chương trình nhập vào Mã sơ SV, Họ tên, Lớp (dùng hàm prompt dé nhập) Sau đĩ hiên thị thơng

tin vừa nhập vào ra bảng theo dạng sau: DANH SÁCH SINH VIÊN - Microsoft Internet Explorer “444 - |Hl x|

| File Edit View Favorites Tools Help cu

Ma SV Ho tén Lớp

r#] Dnne | | 8 My Computer ds

Bai tap 3: dsnut_radio.html

Viết chương trình nhập vào số 3 sé m,n , p (dung ham prompt) Sau đĩ tạo ra một Form gồm cĩ m

phan tử Text , n nhĩm radio mỗi nhĩm cĩ 2 tùy chọn các nút radio cĩ giá trị lần lượt là 1->2*n , va 1

Dropdown menu(Listbox) cĩ p tùy cbn mỗ ¡ option cĩ giá irlần lượt là 1 ->p vàText đa option là Text1 ->Textp (Lưu ý là các phân tử trên Form phải cĩ tên khác nhau.)

Bai 4: thongtindangky.html

Viết chương trình tạo một Form như sau:

2ÄãDđnH SÁCH SINH VIÊN - Microsoft Internet EwploFeF =- =inl xị

| File Edit View Favorites Tools Help mã

| seBack + = + @ 2) đi cach (šjFavortes Emedia —4 Shr Hotén || | Matkhắul[ —- Nha | ` 2

‘€) Done (|| AS) My Computer ⁄

Sau đĩ nhập liệu vào Form khi bắm nút Nhap(button) rồi hiển thị kết quả ra dạng như sau: lấy dữ liệu trường Họ tên hiễển thị vào ơ YourName, Mật khẩu vào ơ YourPWD

2ÄDaNH SÁCH SINH VIÊN - fHicrosoft Internet EMDIOFEE ˆ - || x|

File Edit view Favorites Tools Help ma

Trang 23

Yêu cầu như bài 4 nhưng kiểm tra dữ liệu các trường phải khơng rỗng và trường Password cĩ ít nhất 6 ký tự nếu trường nàokhơng thỏa yêu cầu thì hiển thị thơng báo và đưa con trỏ về ơ đĩ để yêu cầu

người sử dụng nhập lại dữ liệu

Bai 6: thaydoianh.html Thiết kế trang như sau:

2 hew Page 1 - MicrosofE XP (ol x]

| File Edit view Favorites al | + - +=~@ dad) >| =

mal) II (iS My Computer EZ ,

Bam vao nut Play thì chương trình thay đổi hình thay đổi một cách ngẫu nhiên (2 giây đổi 1 hình) Bam

stop thì dừng lại

Bài 8: cuahangbonsai.html

Thiét ké trang như sau Khi người SỬ dụng nhập vào trường sơ lượng và rời khỏi trường này thì ơ

Tổng thành tiền sẽ được cập nhật(lưu ý nếu nhập vào khơng phải là số thì thơng báo yêu cầu nhập lại)

fy C72 HANG BONSAI - Microsoft Internet Explorer ; _- |b} x)

| Eile Edit view Favorites Tools Help |

| <Back + => ~ GD 2] đẩấl| | (l5 earch [&jFavortes BPMedia 4H) S4- S >>

" s ES)

CUA HANG BONSAI

Trang 24

‘“@ New Page 1 - Microsoft Internet Explorer | File Edit View Favorites Tools Help I + »%* 9 1 2l 9 ww 3 ` 6# Kì , = [S5 [cối B71 Stop Refresh Home | Search Favorites Media History Mail Print Edit Discuss | Address |) D-\baithiswEB XESHTML\ProgramingND TB him =} eGo || Links aa = >Y Lt, ~~ > sg == - cơ —_" ee " -

Bang tin thị trường CẠP NHẬT GIÁ CÁ THỊ TRƯỜNG Bang bao gia Vang Nua vao - nà vú u dang thé thao ,sang trong

- NOl pac

Mua vao Ban ra Ban ra | - Tắn ít nhiên liệu

= — - Mui trd

#10000 #12000 Chon hinh quang cao [Toyota =| an

USD Cận nhất chữ Êˆ vàng © USD & = Mua vao Bian ra Update | State

16.4 15.72 EBBSI Ee

Gia : 35000 USD

=

| Done [f(y My Computer

Trong nĩ gồm các tùy chọn sau:

Mua vào, Bán ra là trường textbox

Loại xe là Dropdown Menu gơm các option

Text Value

Toyota /images/mer2.jpg KIA /images/otoa.jpg Ford /images/t2.jpg

Cập nhật cho: gồm 2 tùy chọn lần lượt cĩ giá trị là 1 , 0 mặc định khơng được chon nút nào

Update, State là nút button Yêu cầu xử lý: 1) Khi trang load lên thì con trỏ nhập liệu trong trường 'Mua vào' và nút State ở chế độ khơng cho phép chọn 2) Khi di chuyển con trỏ ra khỏi trường 'Mua vào' nếu như giá trị trường này là số và khơng rỗng thì nút State sáng lên

3) Khi Click vào mục chọn hình quãng cáo thì sẽ thể hiện hình đĩ bên vùng bên

4) Khi bắm vào nút Update và nếu nút radio Vàng' được chọn thì cập dữ liệu ở ‘Bang tin thị trường' trong mục Vàng” cịn ngược lại thì cập nhật ở mục ˆUSD' tương ứng với trường ‘Mua

vào' của cột 'Mua vào' và trường 'Bán ra' của cột 'Bán ra' (Dùng inner để cập nhật)

Trang 25

Bai 10: dangkyhocphan.html Cho trang web sau:

23DAnH SÁCH SINH YIÊN - Hiicrosoft Internet Exzplorer _-:

| File Edit ‘view Favorites Tools Help | | #sak - + - Œ@3 đĐỈ: f5ssach (GyFavorites GPmedia củ | Ey~ Sp > | Address I3 F:1wehtEaitan1HTP*L1InterFaceEt1L0.htm >| Go ~ ¥ =] DANG KY HOC PHAN Ho tén | Lớp [TCTH30A ~] Mơn [Eosununeu =j Loai ™ Ly thuyết Thurc hanh Dang ky |

DANH SACH BANG KY

Họ tên Lop rion Loai dang ky

a b c d

EA

‘@] Done P| | Sd My Computer Za

Yéu cau: (Ty thém cac option trong Listbox va dat gia tri trong radio)

Hãy nhập dữ liệu trên Form sau đĩ bắm Dang ky thì dữ liệu sẽ hiện thị vào các cột tương ứng a,b,c,d

.(Lưu ý là dữ liệu trước đĩ vẫn cịn) dùng:

a) innerHTML hoặc innerT ext b) lírame Ví dụ: Thiết kế Form như sau:

yj THEM SINH ¥IEN - Microsoft Internet Explorer - (oj x|

File Edit View Favorites Tools Help | # |

ai + + ~- K3 far | Ghsearch (Sy Favorites YMedia C4 | Syr ” Address |£Ì D:\therm_sinh_vien.htm *ị Go | Links >

Viết chương trình xử lý theo yêu câu sau:

1 Khi trang load lên thì nút Nhap ở chế độ mờ và con trỏ nhập liệu ở ơ họ tên

2 Khi rời khỏi trường Lớp nếu trường họ tên và lớp khác rỗng thì nút Nhap sáng lên

3 Bấm nút Nhap thì dữ liệu hiển thị vào bảng “Danh Sach Sinh Vien” ở bên dưới và nút Nhap lại mờ

Trang 26

=) THEM SINH ¥IEN - Microsoft Internet Explorer

Pham Thanh Sang CBTHS5A Dương Yên Phượng CBTH5B

Trang 27

BÀI TẬP THIẾT KÉ WEB TỎNG HỢP

Dùng các thẻ HTML để thiết kế các trang web sau: Bài 1:

Tả Hew Page 1 - Microsoft Internet Explorer

File Edit View Favorites Tools Help Links >” a SAIGONTOURIST Holding company <3)

SAIGONTOURIST TRAVEL SERVICE Co Tin tere:

” SaiqnnntrLrrist- Lượng khách di tour giang sinh va nam mdi tang manh " Saigontourist - Đẩy ranh hình thức kinh ciuarth qua rnarig

" Tận hưởng rùa gang simh mien nhiét đới và nhận giải thưởng lớn

Miột số danh lam thang cAanh 3

Thẳng cảnh Sana

he

#] Done sở My Computer

Bai 2:

=i New Page 1 - Microsoft Internet Explorer Seles

File Edit View Favorites Tools Help Links: >” ar

SAIGONTOURIST Holding company =

SAIGONTOURIST TRAVEL SERVICE Co,

MOT SO BIA DIEM DU LICH

- Địa danh Tỉnh-Thành phố

Suối nước nĩng Binh Chau-Viing Tau

Biên Hồ Cũc Bình Châu-Vũng Tàu

Madi né Phan Thiêt-Bình Thuận

Sudi vang-bac Bà Lạt-Lâm Đẳng

MOT SO DANH LAM THANG CANH

Đơi cù ở Đà Lạt Huiế-L ăng CO Đèo Hải Vân- Đà Nẵng

Mọi chỉ tiết xin liên hệ

Trang 28

Bài 4: Bài 5: Bài 6: File Edit View Favorites Tools Help Address C:laaateb\html\E3.htm Noi di Ho Chi Minh Ha Noi Ha Chi Minh Hà hiệt NewYork TR Chi Minh Phú Ũ File Edit ‘Yiew Favorites Tools Help Tr chủ Giới Cac tac Quang cao

4 New Page 1 - Microsoft Internet Explorer

Trang 29

Bài 8: File Edit ‘View Favorites Tools Help Address Ciaaaiweb \html\BS, htm — - — HOP THU GOP ¥ Ho tén Hệ khẩu | Tp Ho Chỉ Minh ¥ Gĩp ý về lĩnh vực [F]Dịch vụ []Sân phẩm [C]Loại khác Ngơn ngữ O anh @ viet Mội dung [Gui][Xea] (<3 HILL Done | EÌ New Page 1 - Microsoft Internet Explorer File Edit View Favorites Tools Help

: - - CHAO MUNG CAC BAN DEN VOI KHOA

| Danh sách sinh viên | Danh sách 1H CNTTTRƯỜNG CAO ĐẦNG CƠNG NGHIỆP 1V

FT xa n

¬ Ket qua MH

Trang 30

Bài 9:

Bài 10:

TS New Padqe 1 - Microsoft Internet Explorer

File Edit View Favorites Tools Help

Trang chil | | Danh sách sinh viên

Danh sách MH Mla sinh vié Xem điểm : TT Ho te kết quả MH Ngay sin Kết quả học tận Hìn Thêm sinh viền Thêm D5 5V Thêm kết quả SV STT MASY tén 1 |thog nLan mm [Thanh han ẹ Save ƠNG NGHỆ THƠNG TIM Browse | sinh Hinh 1/1/1888 Ai jpg 18/1985 h2 gif ngơn ngữ lập tĩnh C#, áp dụng trang lập trinh Web Tuyến nhần viên lập trình ah

Thơng báo về lịch thị HI<]

Whip song tre | ey New Page 1 - Microsoft Internet Explorer eek > OE A| Qseach Gairavortes Gmeda BY) E- Go) - El sh Address [2] D:\PMTUNG\PMTLINGIcau7b.htm aah ` +Š% Sera ma es Trang chu

Danh sách sinh win

ØA CƠNG NGHỆ THƠNG TIN

[DanhsáchwH | Ma S¥:THOOS

Ren diam Ho tén:Pham Yan Canh ene oe Ngày sinh: 19/9/1986 kết quả MH |Kết quả học tập —_ | HS) 0/0/0005 [ Detete | Tên mơn hoc a Điêm

Uke m Thiết ké Web

Trang 31

Bài 11:

New Page 1 - Microsoft Internet Ewxplorer le] x]

File Edit view Favorites Tools Help |

Address l£) D:1SalzOnwebihtml\horne htm ~| Ce Go | Links 7”

J(JjnriMRHIUWBAH 7

Hần hạnh phục vụ cắc ban eee

Hơm nay quốc hội tiếp tục vấn dé giao duc:

Hãm nay quốc hội sẽ thong qua co ché quan lý gián dục, han hành quy định về việc -ASP.Net with C3

thành lập các trường trể thục, cần lận, chính sách đầu tr của các tổ chức nước ngồi vàn =

Miệt Nam Bộ trưởng Rqauyêễn hinh Hiển đã cĩ cuậc trao đổi trực tiến với các nhà gián Rapa is

GSTS ve viec cai cach giao duc xem tiép: Jaya & ISP

Céng nghé mei trang lap trinh mang oF) em erats NEA) Hiện nay việc ng dụng tin học waa sme gty | litle: ASP et

cơng việc quan lý được triển khai rất ISBN: 14895672 mạng mẽ nhất là chuyển t7 ứng dung Author: Thomas Vwillam

r vient tho ng doh lé thanh hé théng quan Ky tap trung Publisher: \vrox

mm eee théng qua mang Intranet hay — Price:45 USO

Tp HOM 30°C | Internet xem tiép: Mua

Tee GH [2256 Rhịp sống trẻ

= Am nhac la mon ăn tình thần trong mỗi đa CŨ: Câu hát nghiệm: râu | rrwrHnRƯờng —| chúng ta, da đĩ những lời ca tiếng hát Phat hanh: VAPHACO

1 USD 15063 phải rỉ vàn lồng người và thẻ hiện tỉnh Gia: 15000 VNB

1 Euro 23302 nghề thuật Way ma hién nay da xuat l4 kia Vàng 86nnn hiện những tràn lưu dịng nhạc trẻ được

sáng tác vơ tội dạ và cịn "copy" cla cac

nước bạn xem tiến;

S a Ps Co ® GIỚI THIỆU CỔNG TY ® LIÊN HỆ THƯƠNG MAI #

Trang 32

Bài 13:

¬ 1-800-FLOWERS.COM - Flowers, Plants, Gourmet and Sweets, Unique Gifts and Specialty Boutiques — Microsolt interne: explorer

Sepak - + - Œ3 ia a | BRsearch fGyFavorites CBxistory [§N- = a - la] KÂ iSend

FLOWERS ARE JUST THE BEGINNING om CB track your order

VF you accourt ? customer service 2u se 6808 2212-11 |s/ Wants hones rip Eg EoUrMmED Stila ia Pai te; eer Receive a mailing? Enter the source code from the ;

Ge to gifting Yellow baron the back of your “

or 2 mailer below and click "go." Or =

+ S1 cếck "q0ˆ tị view all rìaile« s | | ® Ơ send floral fermonade! — Chack out

| nredue | ln Seasan = Season of Roses " Best Sellers

= Summer = Sitt Emergency

* Gil Baskets “ Speciat Sayings

“What's Mey = Love and Romance Gitt Center KG, : Everyday Celebrations SPECIAL SAVINGS AC oy | “ Bithdaz - YWedding / Bridal

EiahteenReses Ol Fashioned Elegant Wishes Classic Dish * Anniversary Shower wWwhenacozenisnt Rose Plant Decorate ther day Garden « Neve Baby # Shovrer = Business Gitts

enough! Timeless rose vith floral elegance vYhen words are not ® Neve Home $84.99 indulgence $44.98 - $64.99 enough $34.99 $34.99 - $54.99 2enuments | ore rows a let Vusil a tin Capes xi = E[ l@ me Bài 14: = Yahoo! Shopping - Microsoft Internet Explorer

Welcome, Guest My Shopping - view Cart/Check Out - Order Status - Sign In

Buy a Yahoo! Gift Card Save billing’shipping info in your Yahoo! Wallet

limited time offer [Search | Search in: Visit select stores tor summer savings! ư rec [All of Shopping ) x] EHCN ere: | ie pelick here

The Hottest Hits in our | Featured Stores”

_ Find Products Video Store!

Apparel, Accessories, and

Shoes "Traffic", "Cast Apray", and

"Crouching Tiger, Hidden awe ey tel EBD

Arts and Collectibles Dragon" ave just afeur of our Di leet 34

top sellers this seeson Check

Accessories ihe gest!

Trang 33

Bài 15:

~l8[ xị

| Address }@) http://www is-edu, hemuns.edu.vnf =| co || Links all File *3

KS gL LH b hỗ trq Sinh viên TY NI ĐH Khoa Học Tự Nhiên

Trang chủ Eureka Thảo luận Nghiên cúu Thuyưiện Thư điện tủ CLB Tin Hoc Tim kiém

Tong hop cactin moi -TS tin: 172 Tin tức

Đào tao » Bane chizne dién te: vi khi chéne lat tei pham méy tinh 7/21/2001 Mew

> «Phat hién 16 hone trong co sở dữ liên Oracke Si 7/21/2001 em

ibe 88> Hacker tan cong nhiéu lam thi tong bao mat do lién sinh lei 7/21/2001 A57

TT i4 | »— Liệu cắc cơng ty cĩ thể tự đối phĩ vớihaclcer ? (Eỳ cuỗi) 7/21/2004 AwZ

— k Liệu các cưag by cĩ the ty doi phé véihacker ? Ky D 7/21/2001 we

Thư viện > Thiet bi khêng dây trrớc hẹng súng cha hacker 7/21/2001 “em!

NI -UI0ì./.1-/08(.) cải), > Mang IRC Bfnet bi tan cng theo kieu DDoS 7/21/2001 Mew!

ị "PB Fme cĩ thê là dau hiệu của các hacker nouy hiểm ŒEÿ T) 7/2//2001 &##'

Đồn Khoa - CLB TH k Nhĩm hacker Pcrzen Box với nạn nhần rmrởi7/212001 Meee Các dịch vụ Internet Hackims l1 (cỳcuưi)7/21/2001 #8

iT > &79 Website bitin cSas trong wane mat phit 7/21/2001 Mew

LS > Lién minh hacker cha phat hanh Peekabooty 7/21/2001 “em? Tham khao P Thơng vấn hacker obi Viaora cho Bill Gates 7212001 “0

_— y Hacking 101 (E‡D721/2001 A6 -

| > Cheng trình tần càng khai thác lễ hàng IS của Microsoft 7/21/2001 Mw

" Loại wofmtm 'hứ hai núy cđhướ dạng bản tia bảo trật của Microsoft 7/21/2001 422

k Dé dang tiéu diét worm Code Red 7/21/2001 Mew! ' of

4 »

€) http! famey.is-edu.hcmuns edu vnjvWwebWews/ShawCortent asp?ME ws ID=2751 [ [ l6= Local irtranet

x UF

Bai 16:

<q vnE xpress - Vietnam News Daily - Microsoft Internet Explorer — || x|

‘| address 5 http: //vnexpress net/vietnam Homer " = = VN | = APRESS SN Dang ky tai day bat cf luc nao FCC su Tit MM AMM wi EW re ae Ú ; fy Iìm kiếm —————=-. = 5 : mega ee |

Kinh doanh Đ 3 chon Tiéng viet} Giri ToS soan |

“Wan heal ea nan xam pham ban quyén

ar : (Hiệp hội các daanh nghiệp nhần mềm Eee LAN DAU TIEN CO TAI VIET NAM

ỉ i cơng lỗ mặt báo câo về vị phạm bắn quyên phần

mm << ⁄ mềm tuân cầu, Irong đĩ wh\ được xếp ở vị trí số ell 1 1 về tinh trang nay trong nam 2000

Vi tính Roe A$ thers

_ Phap luat /

ee Thế gidi: ¬% Speers vừa và như

fat) lot 1agft ời biển tình bi ban chất bên ngom Hai nghi GS eS, Hi T140

=| Sự kiện cảnh sắt Italia hẳn chết một người chẳng

HảaN O | 253 thân cau hoa hém qua (20/7) d& bao trom lén phién N h ieu Ker LỆ 1

Hu 55 35 họp khai mạc của Hội nghị GG Wai gic sau khi bị

Đã Nẵng 2 bẵn, xác người biếu tình sẵn nằm phơi trên quảng

Ho chi Minh aa true Alimonda cla Genoa, xung quanh là cảnh

sat va dam đũng phần đổi hỗ hét

Các tin Thế giới khác | os soo} _

= za2sun | Kinh duanh:

LAF 70,500 Nha ' van mo dich wn taxi tai đ oh a SAM B7 ,sn0 To Nghiễy vận 1ãi đến với Nguyễn Phúc Lậc Thành khi e os

Trang 34

Bài 17:

FR The Code Project - Homepage - Free Source code and Tutorials — Microsoft Internet Explorer

| pack - > - @ |2] Z3 | %ssaech (bJFaderks GPuistory | EL- 4h OS) - [S] EI í@Sena| | Address \€] https} twas, codeproject.cam xz ao | Links > | File Sponsors —_ > € DO O & Coheed | ald ad Home Lotest Submit About Acvertise Contact Forums

Welcome to the Code Project aaeemeneiinentian The Code Projectis 3a place where developers can contribute heir own “le

ideas, share ther own cade, and just hang out and help each other learn Top Articles updated inthe last week Lư ColorCursor ¥ 2.1 5/5 (2) Michael Mogensen CxShadeButton 4,94/5 [33} Davide Pizzolato The Code Project Visual C++ Forum FAQ 4.33/5 [14} Michael Dunn

Last 10 updates at the Code Project

18 Jul 2001 & Ready Made Text Entry Dialog

Cre cent Rndeoo Oosaroe

| Back - => - 3 aa | Bsearch (dq] Favorites GBHistory | Eh a Gy - Ia ka i2)Send |

Định dạng
Số trang	34
Dung lượng	4,28 MB