Mục tiêu bài học

Kết thúc chương này, bạn có thể:

Sử dụng bảng trong tài liệu HTML
Tạo lớp trong tài liệu HTML
Chèn Multimedia (Âm thanh, phim ảnh, Java Applet) vào tài liệu HTML

Chương này đưa ra các bước chi tiết, tổng quát, cần phải thực hiện theo trình tự các bước một cách cẩn thận. Việc này được thực hiện để rèn luyện các mục tiêu đã được học và hiểu một cách hoàn chỉnh về các công cụ. Thực hiện các bước sau đây một cách cẩn thận và trình tự:

Tạo một thư mục, HTML-DHTML-JS-Examples trong ổ đĩa D:\ và lưu tất cả các file .html chỉ trong thư mục này. (Nếu không có đĩa D, hãy tạo trong ổ đĩa C:\)
Chạy chương trình Notepad bằng cách kích vào nút “Start” và chọn “Accessories”.
Gõ đoạn mã ở ví dụ 1
Kích vào File chọn Save As
Lưu file với đuôi .html trong thư mục D:\HTML-DHTML-JS-Examples. Chọn tên thích hợp,
lab61 (Lab21 để biết đây là ví dụ 1 trong bài Lab 6)

hoặc

Lưu nó trong thư mục đăng nhập của mình
Chạy Internet Explorer.
Kích vào File → Open, chọn Browse và chọn file từ thư mục D:\HTML-DHTML-JS-Examples

Thực hiện trong 1h30’ đầu

Đoạn mã HTML tạo một bảng đơn giản có hai dòng và hai cột

<HTML>
    <BODY>
             <TABLE BORDER="1" CELL PADDING="6" CELL SPACING="6">
                    <TR BGColor"CYAN">
                           <TD ALIGN="CENTER">INDIA</TD>
                           <TD ALIGN="CENTER">SOUTH AFRICA</TD>
                    </TR>
                    <TR BGColor="GRAY">
                           <TD ALIGN="CENTER">NEW ZEALAND</TD>
                           <TD ALIGN="CENTER">SRILANKA</TD>
                    </TR>
             </TABLE>
    </BODY>
</HTML>

Hình 2 minh họa kết quả từ ví dụ 2

Đoạn mã HTML hiển thị văn bản Countries trải dài trên 2 dòng

<HTML>
    <TABLE BORDER=5>
        <TD ROWSPAN=2> Countries </TD>
        <TD> INDIA</TD>
        <TD> SOUTH AFRICA</TD>
        <TR>
             <TD> NEW ZEALAND</TD>
             <TD> SRILANKA</TD>
        </TR>
    </TABLE>
</HTML>

Xem kết quả của ví dụ 3

Sử dụng lớp:

Kiểm tra ví dụ 10 và 11 trong chương 5 về cách sử dụng lớp. Kiểm tra kết quả bằng hai trình duyệt IE và Netscape. Chú ý sự khác nhau giữa chúng. Ngoài ra, thử kiểm tra các ví dụ bằng cách kết hợp nhiều màu trong đó. Phần này giúp ta chọn màu sao cho thích hợp nhất để phát triển một web site tốt. Bạn có thể sử dụng các màu được liệt kê dưới đây:

AQUA	DARKVIOLET	LAVENDER	SILVER
BEIGE	FUXHSIA	LIME	SKYBLUE
BLACK	GOLD	LIMEGREEN	SNOW
BLUE	GRAY	LINEN	TAN
>BROWN	GREEN	MAGENTA	TEAL
CHOCOLATE	GREENYELLOW	MAROON	WHEAT
CYAN	HONEYDEW	MEDIUMBLUE	WHITE
DARKBLUE	HOTPINK	NAVY	WHITESMOKE
DARKGREEN	INDIANRED	OLIVE	YELLOW
DARKPINK	INDIGO	PURPLE
DARKRED	IVORY	RED

Sử dụng multimedia:

Kiểm tra các ví dụ 12,13,14 và 15 trong chương 3. Các file multimedia (file ảnh, file âm thanh, file video) sử dụng trong những ví dụ này, bạn có thể thay thế bằng bất kỳ file nào bạn chọn. Nếu không muốn xác định đường dẫn đầy đủ thì bạn hãy đặt chúng trong cùng thư mục với các file HTML nguồn.

Thực hiện trong 1h30’ tiếp theo

Viết đoạn mã HTML để tạo bảng như hình 6.3 dưới đây, bảng có đường viền dày 5 pixels

Viết một tài liệu HTML để hiển thị văn bản trên hai tầng khác nhau. Văn bản phải có màu khác nhau và hãy đặt màu nền cho mỗi tầng.

Tự thực hành

Viết đoạn mã HTML để tạo một bảng như hình 6.4

Trang này được chủ ý để trống

Thực hành sử dụng bảng và lớp trong HTML

Mục tiêu bài học

Thực hiện trong 1h30’ đầu

Thực hiện trong 1h30’ tiếp theo

Tự thực hành