<TABLE> ... </TABLE> Định nghĩa một bảng
<TR> ... </TR> Định nghĩa một hàng trong bảng <TD> ... </TD> Định nghĩa một ơ trong hàng <TH> ... </TH> Định nghĩa ơ chứa tiêu đề của cột <CAPTION> ... </CAPTION> Tiêu đề của bảng
Cú pháp: <TABLE
ALIGN = LEFT / CENTER / RIGHT
BORDER = n BORDERCOLOR = color BORDERCOLORDARK = color BORDERCOLORLIGHT = color BACKGROUND = url BGCOLOR = color CELLSPACING = spacing CELLPADDING = pading >
<CAPTION>Tiêu đề của bảng biểu</CAPTION>
... Định nghĩa các dịng <TR ALIGN = LEFT/CENTER/RIGHT VALIGN = TOP/MIDDLE/BOTTOM> ... Định nghĩa các ơ trong dịng <TD
ALIGN = LEFT / CENTER / RIGHT
VALIGN = TOP / MIDDLE / BOTTOM
BORDERCOLOR = color BORDERCOLORDARK = color BORDERCOLORLIGHT = color BACKBROUND = url BGCOLOR = color COLSPAN = n ROWSPAN = n > ... Nội dung của ơ </TD> ... </TR> ... </TABLE>
Ý nghĩa các tham số:
ALIGN / VALIGN Căn lề cho bảng và nội dung trong mỗi ơ.
BORDER Kích thước đường kẻ chia ơ trong bảng, được đo theo pixel. Giá trị 0 cĩ nghĩa là khơng xác định lề, giữa các ơ trong bảng chỉ cĩ một khoảng trắng nhỏ để phân biệt. Nếu chỉ để border thì ngầm định border=1. Với những bảng cĩ cấu trúc phức tạp, nên
đặt lềđể người xem cĩ thể phân biệt rõ các dịng và cột.
BORDERCOLOR Màu đường kẻ
BORDERCOLORDARK BORDERCOLORLIGHT
Màu phía tối và phía sáng cho đường kẻ nổi.
BACKGROUND Địa chỉ tới tập ảnh dùng làm nền cho bảng
BGCOLOR Màu nền
CELLSPACING Khoảng cách giữa các ơ trong bảng
CELLPADDING Khoảng cách giữa nội dung và đường kẻ trong mỗi ơ của bảng.
COLSPAN Chỉđịnh ơ sẽ kéo dài trong bao nhiêu cột
ROWSPAN Chỉđịnh ơ sẽ kéo dài trong bao nhiêu hàng
BÀI THỰC HÀNH CHƯƠNG BÀI THỰC HÀNH CHƯƠNG BÀI THỰC HÀNH CHƯƠNG BÀI THỰC HÀNH CHƯƠNG 333 3
Các bước trong chương này được trình bày rất chi tiết, đầy đủ và rõ ràng. Bạn sẽ hiểu rõ hơn những nội dung trong bài lý thuyết và cách sử dụng cơng cụ. Hãy thực hiện theo các bước dưới đây một cách cẩn thận.
1. Tạo thưmục HTML-DHTML-JS-Examples trong ổ đĩa D:\ và lưu tất cả các file .htm chỉ trong thưmục này. (Nếu khơng cĩ đĩa D, hãy tạo trong ổ đĩa C:\)
2. Chạy chương trình Notepad bằng cách kích vào nút “Start” và chọn “Accessories”. 3. Gõ đoạn mã vào tài liệu
4. Kích vào File chọn Save As
5. Lưu file với đuơi .htm trong thưmục D:\HTML-DHTML-JS-Examples. 6. Chạy Internet Explorer.
BÀI TẬP 1
1/ Tạo trang web Headings.htm(sử dụng Tag Hn, từ Heading1 đến Heading6)
2/ Tạo trang web HeadingCenter.htm(Phối hợp các Tag)
4/ Tạo trang web Emphasis.htm
6/
BÀI TẬP 2 (Link)
1/ Tạo tập tin links2.htm : tạo các Hyperlink để di chuyển đến các trang htm vừa tạo ở trên.
2/ Tạo tập tin Search.htmđể xây dựng trang Web sau
3/ Sử dụng các tag đã học để tạo 1 trang Web cho riêng bạn (MySite.htm) Nội dung: Tự giới thiệu và Các trang Web ưa thích (tạo các HyperLink)
4/ Tạo trang Web sau (InternalLink)
http://www.google.com for Google http://www.altavista.com for Altavista http://www.Yahoo.com for Yahoo
BÀI TẬP 3 (Image) 1/ Image1.htm
2/ Image2.htm
Hướng dẫn: thêm vào dịng lệnh
BÀI TẬP 4 (Bullete) 1/Unordered.htm. 2/ Ordered.htm. 3/ Definition.htm dl dt dd
4/Horizontal.htm
BÀI TẬP 5 (Table) 1/ Table1.htm
2/ Table2.htm (Tables with images and links) <html>
<head>
<title>Exercise :: Tables2</title> <head>
<body >
<table width="75%" border="1" cellspacing="2" cellpadding="0" align="center">
<tr>
<th>Files from Session 2</th> <th>Files from Session 3</th> <th>Files from Session 4</th> </tr>
<tr>
<td><a href="/headings.htm">headings exercise</a></td> <td>images.htm</td>
<td>unordered.htm</td> </tr>
<tr>
<td><a href="/headingscentered.htm">center align exercise</a></td> <td>images2.htm</td>
<tr>
<td><a href="/emphasis.htm">emphasis exercise</a></td> <td> </td>
<td>definition.htm</td> </tr>
<tr>
<td><a href="/links.htm">links exercise 1</a></td> <td> </td>
<td>table1.htm</td> </tr>
<tr>
<td><a href="/links2.htm">links exercise 2</a></td> <td> </td> <td> </td> </tr> </table> </body> </html>
Dùng các thẻ HTML để thiết kế các trang web sau: 1/ Tourist1.htm
3/ vinair.htm
5) Dulich.htm
BÀI TẬP LÀM THÊM
CHƯƠ CHƯƠ CHƯƠ
CHƯƠNG NG NG NG 4444
CSS (Cascading Style Sheets) c mục chính Bài tập bắt Bài tập làm Tĩm tắt Mục tiêu Các mục chính Bài tập bắt buộc Bài tập làm thêm
Kết thúc bài học này cung cấp học viên kiến thức về tạo CSS trong việc thiết kế giao diện Web … 4.1 Khái niệm về CSS 4.2 Một sốđặc tính cơ bản về CSS Dựa vào bài tập trong phần cuối Chương 4. Dựa vào bài tập trong phần cuối Chương 4. buộc thêm