KIỂM TRA BÀI CŨ
KHỞI ĐỘNG
BÀI 10. TẠO LIÊN KẾT
1. SIÊU VĂN BẢN VÀ ĐƯỜNG DẪN
Siêu văn bản (Hypertext):
Là văn bản tích hợp nhiều dạng dữ liệu (ảnh, âm thanh...) và đặc biệt là các siêu liên kết dẫn đến các tài liệu khác.
Siêu liên kết (Hyperlink):
Giúp người đọc chuyển nhanh đến nội dung liên quan mà không cần đọc tuần tự.
Thẻ tạo liên kết:
Sử dụng thẻ <a> với thuộc tính href chứa địa chỉ đích.
Cấu trúc: <a href="Địa_chỉ_đích">Nội dung hiển thị</a>.
Phân loại đường dẫn (URL) trong href
Đường dẫn tuyệt đối:
Chứa đầy đủ giao thức (http/https) và tên miền. Dùng khi liên kết đến website bên ngoài.
Đường dẫn tương đối:
Chỉ chứa tên tệp hoặc đường dẫn tính từ vị trí hiện tại. Dùng cho các trang trong cùng website.
TRẢ LỜI CÂU HỎI TRẮC NGHIỆM
Câu 1: Trong quá trình tìm hiểu về ngôn ngữ đánh dấu siêu văn bản (HTML) và nền tảng của mạng điện toán toàn cầu, khái niệm "siêu văn bản" (Hypertext) được định nghĩa chính xác nhất là gì theo kiến thức đã học?
Câu 2: Để tạo ra sự kết nối giữa các trang thông tin trên mạng Internet, lập trình viên sử dụng các thẻ HTML chuyên dụng. Thẻ nào sau đây cùng với thuộc tính của nó được sử dụng để tạo một siêu liên kết (hyperlink)?
Câu 3: Khi phân loại các đường dẫn (URL) được cung cấp trong thuộc tính href của thẻ liên kết, loại đường dẫn nào bắt buộc phải chứa đầy đủ thông tin về giao thức (http/https) và tên miền của trang web đích?
Câu 4: Trong một tài liệu văn bản điện tử có chứa dung lượng thông tin rất đồ sộ, việc sử dụng các siêu liên kết (Hyperlink) mang lại lợi ích thiết thực và cốt lõi nhất nào cho người đang thao tác duyệt tài liệu?
Câu 5: Sự khác biệt mang tính bản chất nhất giữa việc sử dụng đường dẫn tương đối so với đường dẫn tuyệt đối khi xây dựng các siêu liên kết trong cùng một dự án thiết kế trang web bằng ngôn ngữ HTML là gì?
Câu 6: Một lập trình viên muốn thiết kế trang web sao cho khi người dùng nháy chuột vào bức ảnh có tên "logo.png" thì trình duyệt sẽ chuyển hướng ngay lập tức đến trang "trang_chu.html". Đoạn mã HTML nào sau đây thực hiện đúng yêu cầu trên?
2. CÁC CÁCH LIÊN KẾT TỚI MỘT TRANG WEB
a) Liên kết tới một trang web khác (Liên kết ngoài)
- Dùng để trỏ tới một trang web trên Internet (không nằm trên máy mình).
- Bắt buộc dùng đường dẫn tuyệt đối.
TRẢ LỜI CÂU HỎI TRẮC NGHIỆM
Câu 7: Trong quá trình phát triển nội dung cho một website, người thiết kế đôi khi cần tạo ra các liên kết ngoài. Mục đích chính của việc tạo ra loại liên kết ngoài (liên kết tới một trang web khác) này là để làm gì?
Câu 8: Khi thiết lập một thẻ liên kết ngoài để chuyển hướng người dùng từ trang web hiện tại của mình sang một trang web khác nằm trên Internet, người lập trình bắt buộc phải tuân thủ quy tắc nào đối với phần đường dẫn (URL)?
Câu 9: Bạn đang quản trị một trang web tin tức và muốn tạo một dòng chữ "Đến Google" để khi người dùng nhấn vào sẽ tự động mở công cụ tìm kiếm Google. Cú pháp HTML chuẩn xác nhất cho thao tác tạo liên kết ngoài này là gì?
b) Liên kết đến một vị trí khác trong cùng website (Liên kết trong)
Sử dụng đường dẫn tương đối để liên kết các trang nội bộ. Có các trường hợp sau:
Liên kết cùng thư mục:
Chỉ cần viết tên tệp.
Liên kết đến thư mục con (cấp dưới):
Viết theo cú pháp tên_thư_mục/tên_tệp.
Liên kết đến thư mục cha (cấp trên):
Dùng ../ để quay lui một cấp thư mục.
Liên kết đến vị trí cụ thể trong cùng một trang (Bookmark):
- Bước 1: Đặt id tại vị trí đích: <the_html id="ten_id">...</the_html>.
- Bước 2: Tạo link trỏ đến id đó với dấu #: <a href="#ten_id">...</a>.
Tạo liên kết cho hình ảnh:
Lồng thẻ <img> vào bên trong thẻ <a>.
TRẢ LỜI CÂU HỎI TRẮC NGHIỆM
Câu 10: Khi thực hiện thiết lập liên kết nội bộ giữa các trang web đang được lưu trữ chung bên trong cùng một thư mục của một website, lập trình viên cần viết đường dẫn URL trong thuộc tính href của thẻ theo quy tắc đơn giản nào?
Câu 11: Trong hệ thống tập tin của một website phức tạp, khi người thiết kế muốn tạo một liên kết trỏ từ tệp tin hiện tại quay ngược lên tệp tin nằm ở thư mục cha (cấp trên), họ phải sử dụng kí hiệu đặc biệt nào cho đường dẫn?
Câu 12: Nếu một tệp tin chứa siêu liên kết đang nằm ở thư mục gốc và muốn trỏ hướng đến một tệp tin đích nằm trong thư mục con (cấp dưới), cấu trúc đường dẫn tương đối bên trong thuộc tính href phải tuân theo định dạng chuẩn nào dưới đây?
Câu 13: Nhằm tạo ra một liên kết giúp người dùng có thể nháy chuột và di chuyển một cách nhanh chóng đến một vị trí cụ thể ngay bên trong cùng một trang web (Bookmark), người lập trình cần phải thực hiện đúng những thao tác cơ bản nào?
Câu 14: Trang web của bạn có một bảng lịch hoạt động câu lạc bộ được đặt ở phía cuối trang. Để tạo một nút nhấn "Xem lịch hoạt động" từ đầu trang nhảy thẳng xuống bảng này, bạn cần kết hợp hai đoạn mã HTML nào cho chính xác nhất?
3. THỰC HÀNH TẠO LIÊN KẾT
Nhiệm vụ 1: Tạo liên kết trong cùng trang
- Mục tiêu: Bấm vào dòng chữ giới thiệu sẽ nhảy đến bảng nội dung bên dưới.
- Cách làm:
+ Đặt id="CLBTT" cho thẻ <table> bảng câu lạc bộ.
+ Tạo thẻ <a> với href="#CLBTT" bao quanh dòng chữ muốn bấm. - Ví dụ: <a href="#CLBTT">Xem lịch hoạt động</a>
Nhiệm vụ 2: Tạo liên kết sang trang khác
- Mục tiêu: Từ trang chủ bấm để sang trang thông tin chi tiết.
- Cách làm: Viết đường dẫn tương đối đến tệp tin mới tạo.
- Ví dụ: <a href="thong_tin.html">Xem thông tin chi tiết</a>.
