- Thiết kế được trang web có các kiểu danh sách: không theo thứ tự, theo thứ tự, định nghĩa.. Danh sách trong HTML được hiểu là một list các đối tượng được hiển thị theo cùng một kiểu gi
Trang 1GIÁO ÁN SỐ: 01 Thời gian thực hiện:…4 tiết……
Tên bài học trước: Cấu trúc và nguyên tắc trong
HTML
Thực hiện từ ngày:17/3/2011
Tên bài:
DANH SÁCH TRONG HTML
A-CHUẨN BỊ
1. Mục tiêu bài học:
Sau khi học xong bài học này học sinh có khả năng:
- Mô tả được cú pháp tạo danh sách
- Thiết kế được trang web có các kiểu danh sách: không theo thứ tự, theo thứ tự, định nghĩa.
- Tạo hứng thú, long say mê của học sinh đối với môn học
- Có thái độ nghiêm túc trong giờ học, chấp hành đúng nội quy phòng máy
- Có trách nhiệm bảo vệ trang thiết bị trong phòng máy
2. Đồ dùng và trang thiết bị dạy học:
- Máy vi tính
- Phần mềm Adobe Dreamweaver CS5
- Máy chiếu
- Bảng, phấn
3. Hình thức tổ chức dạy học:
- Tập trung học sinh học lí thuyết và hướng dẫn đầu tiết
- Thực hành cá nhân
B-CÁC BƯỚC LÊN LỚP
1. Ổn định lớp:
- Chào: 30s
- Điểm danh: vắng:……….có mặt:……… 2p
2. Kiểm tra bài cũ: (10p)
Dự kiến số học sinh kiểm tra:
Điểm
Trang 2 Câu hỏi:
Câu 1: Nêu cấu trúc một trang HTML?
Câu 2: Nêu một số nguyên tắc trong HTML?
Đáp án:
Câu 1:
<html>
<head>
<title>tiêu đề</title>
</head>
<body>
Nội dung
</body>
</html>
Câu 2:
• Tên tag không phân biệt chữ hoa và chữ thường
• Giá trị của thuộc tính nên được đặt trong dấu nháy đơn
hoặc dấu nháy kép (thường dùng)
• Các tag html có thể lồng nhau
• HTML sẽ hiện thị đúng 1 kí tự khoảng trắng giữa các từ
trong vùng nội dung của HTML element
• Còn kí tự tab, kí tự xuống dòng sẽ được bỏ qua
=> Không sử dụng những kí tự này để định vị nội dung của
trang web
3. Thực hiện bài học:
GIAN
web có sử dụng danh sách.
- Quan sát.
5p
4,5p
Trang 3-Tên bài: “DANH SÁCH TRONG
HTML”
- Đặt câu hỏi:
Muốn tạo được
1 trang web như thế này, chúng ta phải làm gì?
- Nhận xét.
-Ghi tên bài lên bảng.
- Lắng nghe, trả lời câu hỏi.
-Ghi chép.
30s
- Nội dung bài học.
- Mục tiêu.
- Nêu nội dung của bài học.
- Chiếu mục tiêu
và giảng giải.
- Lắng nghe.
- Quan sát, lắng nghe.
3p
1. Định nghĩa.
Danh sách trong HTML được
hiểu là một list các đối tượng
được hiển thị theo cùng một
kiểu giống nhau
2. Các loại danh sách.
2.1 Danh sách không theo thứ tự:
2.1.1 Khái niệm.
Danh sách không theo thứ
tự là một danh sách các mục
Danh sách của các mục sẽ được đánh dấu bởi những bullet (dạng như gạch đầu dòng nhưng là một vòng tròn màu đen).
2.1.2 Code.
<ul>
<li>Danh sách một</li>
<li>Danh sách
(Chiếu slide 3 )
Nêu khái niệm Phân tích khái niệm
Chiếu slide
- Quan sát, ghi chép.
Lắng nghe
Quan sát
162p
3p
30p
5p
5p
Trang 4</ul>
2.1.3 Ví dụ.
<ul>
<li>Khoa SPKT</li>
<li>Khoa CNTT</li>
</ul>
*Kết quả:
• Khoa SPKT
• Khoa CNTT
2.1.4 Áp dụng.
Cho bài tập:
Bạn hãy hiển thị trên trang
web nội dung sau
Một số môn chuyên ngành
CNTT
• Cơ sở lập trình 1
• Thiết kế web
• Tin học đại cương
• Cấu trúc dũ liệu
2.1.5.
2.2 Danh sách theo thứ tự:
2.2.1 Khái niệm.
Danh sách theo thứ tự
cũng là một dạng danh
sách của các mục Nhưng
những mục trong đó được
đánh dấu bởi số Một danh
sách theo thứ tự bắt đầu
với thẻ <ol> Mỗi mục
được bắt đầu với thẻ <li>.
2.2.2 Code.
<ol>
<li>Danh sách 1</li>
<li>Danh sách 2</li>
</ol>
2.2.3 Ví dụ.
<ol>
<li>Khoa SPKT</li>
<li>Khoa CNTT</li>
</ol>
*Kết quả:
1. Khoa SPKT
2. Khoa CNTT
2.2.4. Áp dụng.
Bạn hãy hiển thị trên trang
web nội dung sau
Sử dụng phần mềm Adobe
Dreamweaver CS5 Cho ví dụ chạy chương trình và phân tích
( Chiếu slide )
(Chiếu slide) Nêu khái niệm Phân tích khái niệm
Chiếu slide
Sử dụng phần mềm Adobe
Dreamweaver CS5 Nhập đoạn code chạy chương trình
và phân tích
Chiếu Slide
Làm theo Xem kết quả
Thực hành
Lắng nghe
Quan sát,lắng nghe
Thực hành theo Xem kết quả
Thực hành
10p
10p
32p
7p
5p
10p
10p
Trang 5Các thành phố trực thuộc
TW Việt Nam:
1. Hà Nội
I. Hải Phòng
i. Đà Nẵng
A. TP HCM
a. Cần Thơ
2.3 Danh sách định nghĩa:
2.3.1 Khái niệm.
Một danh sách dạng
định nghĩa không phải là
danh sách của các hạng
mục Nó là một danh
sách của các thuật ngữ
và những lời giải thích
của thuật ngữ đó Một
danh sách định nghĩa bắt
đầu với thẻ <dl> Mỗi
một thuật ngữ được bắt
đầu với thẻ <dt> Mỗi
định nghĩa trong danh
sách định nghĩa được bắt
đầu bằng thẻ <dd>
2.3.2 Code.
<dl>
<dt>Danh sách 1</dt>
<dd>Mô tả 1</dd>
<dt>Danh sách 2</dt>
<dd>Mô tả 2</dd>
</dl>
2.3.3 Ví dụ.
<dl>
<dt> Danh sách
không theo thứ
tự</dt>
<dd> Các mục sẽ
được đánh dấu bởi
những bullet </dd>
<dt> Danh sách
theo thứ tự</dt>
<dd> Các mục
được đánh dấu bởi
số</dd>
<dt> Danh sách
định nghĩa</dt>
<dd>
Danh sách của
các thuật ngữ và
những lời giải
Nêu khái niệm Phân tích
(Chiếu slide) Phân tích cấu trúc
Sử dụng phần mềm Adobe
Dreamweaver CS5 Nhập đoạn code chạy chương trình
và phân tích
Lắng nghe,chép bài
Lắng nghe
Làm theo các bước, xem kết quả
35p
5p
5p
15p
Trang 6thích của thuật ngữ đó</dd>
</dl>
*Kết quả:
Danh sách không theo thứ tự
Các mục sẽ được đánh dấu bởi những bullet
Danh sách theo thứ tự Các mục được đánh dấu bởi số
Danh sách định nghĩa Danh sách của các thuật ngữ và những lời giải thích của thuật ngữ đó
2.3.4 Áp dụng.
Hãy hiển thị nội dung và format văn bản như sau:
Toán CC A1
Toán CC A3 Vật lý A1
Vật lý A3
2.4 Bài tập tổng hợp:
Hãy tạo một trang HTML trong đó có chứa các kiểu danh sách vừa học
(Chiếu slide)
(Chiếu slide)
Thực hành
Thực hành
10p
40p
- Củng cố kiến thức:
- Củng cố kĩ năng rèn luyện:
- Chiếu câu hỏi
- Phát phiếu kiểm tra
(trắc nghiệm).
- Chiếu đáp án
- Nhận xét kết quả bài kiểm tra
- Nhận xét kết quả buổi học
- Quan sát, lắng nghe
- Nhận phiếu kiểm tra và làm bài
- Quan sát, lắng nghe, ghi nhớ
- Lắng nghe, ghi nhớ
- Lắng nghe, ghi nhớ.
20p
2p
5p
3p 4p 3p
3p
Trang 75 HƯỚNG DẪN TỰ HỌC Ôn tập và ghi nhớ cú pháp tạo danh
4. Rút kinh nghiệm tổ chức thực hiện
………
………
………
………
………
TRƯỞNG KHOA/ TRƯỞNG BỘ MÔN Ngày …tháng …năm… ……… GIÁO VIÊN …………
