1. Làm quen với tài liệu HTML
Hãy cùng tìm hiểu xem tài liệu HTML hoạt động như thế nào. Tất cả các tài liệu HTML bắt đầu từ đâu? Mỗi tài liệu HTML có cấu trúc bao gồm ba thẻ lồng nhau: html, head và body. Đây là tiêu chuẩn, ví dụ:
<!DOCTYPE html>
<html>
<head>
Các thẻ phục vụ mục đích hệ thống
</head>
<body>
Tài liệu chính
</body>
</html>
Tất cả những gì trình duyệt hiển thị nằm trong thẻ cặp body (phần chính của tài liệu). Bên trong thẻ head là các thẻ chứa thông tin phục vụ hỗ trợ cho trình duyệt.
Cũng như vậy, ở đầu tài liệu ta thường (nhưng không bắt buộc) viết kiểu tài liệu — DOCTYPE, để trình duyệt hiểu cách phân tích lỗi tốt hơn. Nhiều trình duyệt có khả năng hiển thị tài liệu có bố cục bị lỗi một cách đúng đắn.
2. Ví dụ về tài liệu HTML
Tài liệu HTML là nền tảng của mọi trang web. Nó thông báo cho trình duyệt biết cách hiển thị trang. Đây là một ví dụ đơn giản về tài liệu HTML:
<!DOCTYPE html>
<html>
<head> <title>Tên của trang</title> </head>
<body> <h1>Xin chào, thế giới!</h1> <p>Đây là trang web đầu tiên của tôi.</p> </body>
</html>
Các phần chính của tài liệu HTML
Dòng này được gọi là khai báo kiểu tài liệu (doctype). Nó thông báo cho trình duyệt rằng tài liệu này được viết bằng HTML5, phiên bản mới nhất của ngôn ngữ HTML. Điều này quan trọng để hiển thị trang một cách chính xác.
<html>
Thẻ <html> mở ra tài liệu HTML. Tất cả nội dung của trang web phải được đặt bên trong thẻ này. Nó đánh dấu sự bắt đầu và kết thúc của tài liệu HTML.
<head>
Thẻ <head> chứa thông tin phục vụ về trang. Thông tin này không hiển thị trực tiếp trên trang web, nhưng quan trọng cho trình duyệt và các công cụ tìm kiếm.
Thẻ <title> đặt tên cho trang, hiển thị trên tab của trình duyệt. Đây là điều đầu tiên người dùng nhìn thấy khi mở trang.
<body>
Thẻ <body> chứa tất cả nội dung có thể nhìn thấy của trang web: văn bản, hình ảnh, liên kết, bảng v.v. Tất cả nội dung mà người dùng nhìn thấy trên màn hình đều nằm trong thẻ này.
<h1>Xin chào, thế giới!</h1>
Thẻ <h1> đại diện cho tiêu đề cấp một. Nó được sử dụng cho các tiêu đề quan trọng nhất trên trang. Văn bản bên trong thẻ này được hiển thị lớn và in đậm.
<p>Đây là trang web đầu tiên của tôi</p>
Thẻ <p> được sử dụng để đánh dấu đoạn văn bản. Nó dùng để chia văn bản thành các khối hợp lý. Văn bản trong thẻ này được hiển thị như một đoạn văn bình thường.
GO TO FULL VERSION