PHT - BÀI 1- LÀM QUEN VỚI NGÔN NGỮ ĐÁNH DẤU SIÊU VĂN BẢN (2)
Preview text:
PHIẾU HỌC TẬP 🌐
Môn học: Tin học (Lập trình Web cơ bản)
BÀI 1: LÀM QUEN VỚI NGÔN NGỮ ĐÁNH DẤU SIÊU VĂN BẢN
Tên học sinh 1: Bùi Phương Anh.....................................................................................
Tên học sinh 2: .Tô Ngọc Ánh....................................................................................
I. CÁC THÀNH PHẦN CƠ BẢN (15 phút)
1. Thẻ (Tag) và Cặp Thẻ
a) Thẻ HTML là gì? Là ngôn ngữ chuyên dụng dùng để tạo trang web.
b) Phân biệt thẻ mở, thẻ đóng và thẻ rỗng (thẻ không có nội dung):
Loại thẻ | Ví dụ | Đặc điểm |
|---|---|---|
Thẻ mở | <p> | .Luôn đứng đầu tiên không có dấu gạch chéo (/) ở đầu.................................................... |
Thẻ đóng | </p> | Luôn có dấu gạch chéo (/) ở đầu. |
Thẻ rỗng | <br>, <img> | Chỉ có thẻ mở, không cần thẻ đóng. |
2. Thuộc tính (Attribute)
a) Thuộc tính dùng để làm gì? Nêu ví dụ về một thuộc tính thường dùng. ...dùng để mô tả,bổ sung thông tin hoặc định cấu hình choi một đối tượng, một thực thể hoặc một phân tử. Ví dụ: “Họ tên” “Ngày sinh” là các thuộc tính của thực thể “Sinh viên”................................................................................................................................................
b) Hãy viết thẻ mở của một liên kết có đường dẫn là dantri.com và thuộc tính blank
<a href=https://dantri.com.vn/target=”_blank”>
II. CẤU TRÚC CHUẨN CỦA MỘT TÀI LIỆU HTML (20 phút)
1. Bốn Cặp Thẻ Chính
Em hãy điền vào sơ đồ dưới đây để thể hiện cấu trúc cơ bản của một tài liệu HTML, và nêu vai trò của từng phần:
Thẻ/Khu vực | Vai trò/Chức năng | Nội dung thường đặt bên trong |
|---|---|---|
<!DOCTYPE html> | Khai báo loại tài liệu, giúp trình duyệt nhận diện đây là tài liệu HTML5. | (Không phải thẻ, là khai báo) |
<html> ... </html> | Thể hiện toàn bộ cấu trúc và nội dung trang web ..................................................... | Bao bọc toàn bộ mã nguồn của trang web. |
<head> ... </head> | Chứa các thông tin mô tả cho trình duyệt (metadata), không hiển thị trực tiếp lên trang web. | <title>, <meta>, <link>, <style> |
<body> ... </body> | .Phần thân (body) của văn bản HTML.................................................... | .Được viết trong cặp thẻ mở<body> và thẻ đóng</body> .................................................... |
2. Thẻ Tiêu đề (<title>) và Thẻ Tiêu đề trang (<h1> - <h6>)
Phân biệt vai trò của thẻ <title> và các thẻ <h1> – <h6>:
Thẻ | Vị trí đặt | Mục đích |
|---|---|---|
<title> ... </title> | Bên trong <head> | Đặt tên hiển thị trên thanh tiêu đề của trình duyệt/tab. |
<h1> ... <h6> | Bên trong<body>..................................................... | .Dùng để khai báo tiêu đề trang web,các siêu dữ liệu mô tả thông tin về trang web..................................................... |
3. Thực hành đọc mã
Phân tích đoạn mã HTML sau:
a) Nội dung nào sẽ hiển thị trên thanh tab của trình duyệt? ..Trang web cá nhân..................................................................................................................................................
b) Nội dung nào sẽ hiển thị bên trong cửa sổ trình duyệt (phần thân trang)? ..Chào mừng đến với trang của tôi .....và Đây là đoạn văn bản đầu tiên.............................................................................................................................................
III. TỔNG KẾT VÀ LUYỆN TẬP (10 phút)
Sử dụng các thẻ cơ bản đã học, em hãy viết một đoạn mã HTML ngắn để tạo một trang web đơn giản với các yêu cầu sau:
- Tiêu đề Tab là "Bài Tập HTML".
- Phần nội dung có một tiêu đề lớn nhất (H1) là "Cấu trúc đã hoàn thành!".
- Bên dưới là một đoạn văn bản bất kỳ.
<!DOCTYPE html>
<html>
<head>
<title> Bài Tập HTML </title>
<meta charset="utf-8">
</head>
<body>
<p>Cấu trúc đã hoàn thành!</p>
</body>
</html>
tác dụng của sự li kì trong văn bản"Trái tim của hổ”
