Bắt đầu HTML
Tệp HTML chỉ đơn giản là một tệp văn bản được lưu với phần mở rộng .html hoặc .htm.
Bắt đầu
Trong hướng dẫn này, bạn sẽ học cách tạo một tài liệu HTML hoặc một trang web dễ dàng như thế nào. Để bắt đầu viết mã HTML, bạn chỉ cần hai thứ: một trình soạn thảo văn bản đơn giản và một trình duyệt web.
Nào hãy bắt đầu với việc tạo trang HTML đầu tiên của bạn.
Tạo tài liệu HTML đầu tiên của bạn
Chúng ta hãy đi qua các bước sau đây. Ở phần cuối của hướng dẫn này, bạn sẽ tạo một tệp HTML hiển thị thông báo "Hello World!" trong trình duyệt web của bạn.
Bước 1: Tạo tệp HTML
Mở trình soạn thảo văn bản thuần túy trên máy tính của bạn và tạo một tệp mới.
Mẹo: Chúng tôi khuyên bạn nên sử dụng Notepad, Sublime Text (trên Windows), TextEdit (trên Mac) hoặc một số trình soạn thảo văn bản đơn giản khác để thực hiện việc này; không sử dụng Word hoặc WordPad! Khi bạn hiểu các nguyên tắc cơ bản, bạn có thể chuyển sang các công cụ nâng cao hơn như Adobe Dreamweaver.
Bước 2: Nhập một số mã HTML
Bắt đầu với một cửa sổ trống và nhập mã sau:
Ví dụ
<!DOCTYPE html>
<html lang="en">
<head>
<title>A simple HTML document</title>
</head>
<body>
<p>Hello World!<p>
</body>
</html>Bước 3: Lưu tệp
Bây giờ hãy lưu tệp trên màn hình của bạn dưới dạng "myfirstpage.html".
Ghi chú: Điều quan trọng là phần mở rộng phải được chỉ định là .html - một số trình soạn thảo văn bản, chẳng hạn như Notepad, sẽ tự động lưu nó như là .txt.
Để mở tệp trong trình duyệt. Tìm đến tệp của bạn sau đó nhấp đúp vào tệp đó. Nó sẽ mở trong trình duyệt Web mặc định của bạn. Nếu không, hãy mở trình duyệt của bạn và kéo tệp vào đó.
Giải thích mã
Bạn có thể nghĩ mã đó là gì. Nào chúng ta hãy tìm hiểu.
- Dòng đầu tiên
<!DOCTYPE html>là khai báo kiểu tài liệu . Nó hướng dẫn trình duyệt web rằng tài liệu này là tài liệu HTML5. Nó không phân biệt chữ hoa chữ thường. - Phần tử
<head>là vùng chứa cho các thẻ cung cấp thông tin về tài liệu, ví dụ: thẻ<title>xác định tiêu đề của tài liệu. - Phần tử
<body>chứa nội dung thực của tài liệu (đoạn văn, liên kết, hình ảnh, bảng, v.v.) được hiển thị trong trình duyệt web và hiển thị cho người dùng.
Bạn sẽ tìm hiểu chi tiết về các phần tử HTML khác nhau trong các chương sắp tới. Hiện tại, hãy chỉ tập trung vào cấu trúc cơ bản của tài liệu HTML.
Lưu ý: Khai báo DOCTYPE xuất hiện ở đầu trang web trước tất cả các phần tử khác; tuy nhiên, bản thân khai báo loại tài liệu không phải là thẻ HTML. Mọi tài liệu HTML đều yêu cầu khai báo loại tài liệu để đảm bảo rằng các trang của bạn được hiển thị chính xác.
Mẹo: Thẻ <html>, <head> và <body> tạo nên khung cơ bản của mọi trang web. Nội dung bên trong <head> và </head> không hiển thị đối với người dùng ngoại trừ một ngoại lệ: văn bản giữa thẻ <title> và </title> xuất hiện dưới dạng tiêu đề trên tab trình duyệt.
Thẻ và phần tử HTML
HTML được viết dưới dạng các phần tử HTML bao gồm các thẻ đánh dấu. Các thẻ đánh dấu này là đặc điểm cơ bản của HTML. Mỗi thẻ đánh dấu bao gồm một từ khóa, bao quanh bởi dấu ngoặc nhọn, chẳng hạn như <html>, <head>, <body>, <title>, <p>, và ...
Các thẻ HTML thường có các cặp như <html> và </html>. Thẻ đầu tiên trong một cặp thường được gọi là thẻ mở (hoặc thẻ bắt đầu) và thẻ thứ hai được gọi là thẻ đóng (hoặc thẻ kết thúc).
Thẻ mở và thẻ đóng giống hệt nhau, ngoại trừ dấu gạch chéo ( /) sau dấu ngoặc nhọn mở của thẻ đóng, để cho trình duyệt biết rằng lệnh đã được hoàn thành.
Ở giữa thẻ bắt đầu và thẻ kết thúc, bạn có thể đặt nội dung thích hợp. Ví dụ, một đoạn văn, được đại diện bởi phần tử <p>, sẽ được viết là:
Ví dụ
<p>This is a paragraph.</p>
<!-- Paragraph with nested element -->
<p>
This is <b>another</b> paragraph.
</p>Bạn sẽ tìm hiểu về các phần tử HTML khác nhau trong chương sắp tới.