BÀI 7. HTML VÀ CẤU TRÚC TRANG WEB
1. TRANG WEB VÀ HTML
HTML (Hypertext Markup Language) là ngôn ngữ đánh dấu siêu văn bản, dùng để tạo nên cấu trúc và nội dung của trang web. Một tệp HTML là một tệp văn bản thường có đuôi là .html hoặc .htm.
a) Thẻ đánh dấu HTML
Khái niệm: Là các từ khóa nằm trong cặp dấu ngoặc nhọn < > dùng để định dạng nội dung.
Đặc điểm:
- Thường đi theo cặp: Thẻ bắt đầu <tên thẻ> và thẻ kết thúc </tên thẻ>.
- Một số ít là thẻ đơn (chỉ có thẻ bắt đầu).
- Có thể thêm các thuộc tính bên trong thẻ bắt đầu để tùy chỉnh.
- Không phân biệt chữ hoa, chữ thường (nhưng nên viết chữ thường).
b) Phần tử HTML
Khái niệm: Bao gồm thẻ bắt đầu, nội dung bên trong và thẻ kết thúc (đối với thẻ đôi). Thẻ đơn và nội dung của nó cũng là một phần tử.
Cấu trúc cây: Các phần tử có thể lồng nhau (phần tử con nằm trong phần tử cha) tạo nên cấu trúc phân cấp.
2. CẤU TRÚC CƠ BẢN CỦA MỘT TỆP HTML
Cấu trúc trang web giống như một cái cây (cây thông tin), với phần tử gốc là <html> bao trùm tất cả.
Khai báo kiểu tệp: Dòng đầu tiên luôn là <!DOCTYPE html> để trình duyệt hiểu đây là tệp HTML.
Phần tử <html>: Là phần tử gốc, chứa toàn bộ nội dung trang web. Thường chia làm 2 phần chính:
- Phần tử <head>: Chứa thông tin khai báo, cấu hình (không hiển thị nội dung trực tiếp trên trang).
- Chứa <title>: Tên trang web hiển thị trên tab trình duyệt.
- Chứa <meta>: Khai báo bảng mã (ví dụ UTF-8 để gõ tiếng Việt).
- Phần tử <body>: Chứa toàn bộ nội dung mà người dùng nhìn thấy trên màn hình (văn bản, hình ảnh, video...).
3. PHẦN MỀM SOẠN THẢO HTML
a) Phần mềm Notepad
Là phần mềm soạn thảo văn bản thô sơ, có sẵn trên Windows (hoặc TextEdit trên MacOS). Không hỗ trợ tô màu từ khóa hay gợi ý mã.
b) Phần mềm soạn thảo HTML chuyên nghiệp nguồn mở
Các phần mềm chuyên dụng như Notepad++ hoặc Sublime Text. Hỗ trợ tô màu mã lệnh, gợi ý thẻ, đánh số dòng giúp lập trình dễ dàng và ít lỗi hơn.
c) Sử dụng trang web hỗ trợ soạn thảo HTML trực tuyến
Soạn thảo trực tiếp trên trình duyệt web (như w3schools.com, tutorialspoint.com). Màn hình chia làm 2 phần: một bên gõ mã, một bên hiện kết quả ngay lập tức khi bấm nút "Run".
