FPT-Aptech Phạm Ngọc Hùng 20/11/2008

1 HDJ - BÀI TẬP HTML - CSS

Xây dựng trang web cá nhân như sau:
Tạo một trang chính (có tên là index.html) chứa FrameSet gồm 2 cột (2 Frame dạng cột):
• Frame bên trái có tên là MUCLUC chứa trang liên kết (trang mucluc.html)
• Frame bên phải có tên là NOIDUNG ñể chứa các trang nội dung.
Trang mucluc.html chứa các liên kết ñến các trang:
• Thông tin cá nhân
• Kết quả học tập
• Thời khóa biểu
• Giải trí - âm nhạc
• Phiếu nhận xét
Mỗi khi người dùng bấm vào từng liên kết thì trình duyệt sẽ mở các trang tương ứng vào trong khung
bên phải (Frame có tên là NOIDUNG).
Thông tin về từng trang nội dung ñược mô tả dưới ñây:

1.1 Tạo trang thông tin cá nhân

Trang HTML mô tả thông tin cá nhân (còn gọi là CV) với các nội dung sau:
• Thông tin cá nhân
1. Họ và tên
2. Ngày sinh
3. ðịa chỉ thường trú
4. Quê quán
5. Thư ñiện tử
6. ðiện thoại
• Quá trình ñào tạo: Nếu rõ khoảng thời gian, cấp học và tên trường học.
• Quá trình làm việc: Nêu rõ khoảng thời gian, nơi làm việc, vị trí ñảm trách, nội dung công việc.
• Kỹ năng: Những kỹ năng của cá nhân về mọi mặt (công cụ, ngôn ngữ lập trình, v.v.)
• Kinh nghiệm: Những công việc, dự án ñã tham gia, công việc ñảm trách trong dự án ñó.
• Sở thích: Những sở thích cá nhân và các hướng nghiên cứu, phát triển.

1.2 Tạo trang kết quả học tập

Hiển thị kết quả học tập của các cấp học, bao gồm các thông tin sau:
Khối lớp
ðiểm trung bình
Xếp loại
Bảng ñiểm ñược hiển thị trong một bảng (dùng <TABLE>), có dạng như sau:

Khối lớp ðiểm trung bình Xếp loại

Khối lớp ... 7.9 khá

... ... ...

☻Bài tập HDJ Page 1 of 2

FPT-Aptech Phạm Ngọc Hùng 20/11/2008

1.3 Tạo trang thời khóa biểu

Tạo trang web lưu thời khóa biểu các lớp học tại APTECH trong tháng (chẳng hạn hiện tại ñang là
tháng 11 thì lập thời khóa biểu cho tháng 11). Sử dụng bảng (TABLE) ñể tạo bảng thời khóa biểu.

1.4 Tạo trang giải trí - âm nhạc

Xây dựng trang giải trí âm nhạc, trong ñó gồm:
Bài viết về một ca khúc nào ñó.
Chèn Video-Clip về một bài hát.
Chèn Hình ảnh của ca sĩ hoặc nhạc sĩ sáng tác bài hát ñó.
Cho phép mở bài hát (Audio - không có hình).

1.5 Tạo trang phiếu nhận xét

Tạo một trang mẫu biểu có các ô nhập thông tin nhận xét ñánh giá của bạn ñọc (người xem trang web
này). Mẫu biểu chứa các trường dữ liệu sau:
• Tên hoặc nickname: là một ô Input:Text ñể người dùng gõ tên hoặc nickname.
• ðịa chỉ email: là một ô Input:Text ñể người dùng gõ email vào.
• ðánh giá: Là một dãy 3 ô Input-Radio: Hay / Trung bình / Cần phải cải thiện.
• Nhận xét: là một ô TextArea ñể người dùng gõ những lời nhận xét.
• 2 nút bấm: một nút [Gửi] ñể SUBMIT biểu mẫu ñi, một nút [Nhập lại] xóa dữ liệu ñã có ñể nhập
lại.

1.6 Hoàn thiện trang HTML với CSS

Sau khi hoàn thành trang web, sử dụng CSS ñể ñịnh dạng và trang trí lại cho trang HTML.

☻Bài tập HDJ Page 2 of 2