Đối với những bạn mới đặt chân vào con đường “lập trình web” thì HTML sẽ là ngôn ngữ đầu tiên mà các bạn cần phải học, và đây cũng chính là bài đầu tiên trong loạt tài liệu hướng dẫn học HTML. Cho nên, tôi sẽ cố gắng nói thật đơn giản để giúp các bạn có được cái nhìn tổng quan về ngôn ngữ này.
HTML là gì?
HTML là chữ viết tắt của cụm từ HyperText Markup Language, dịch sang tiếng việt có nghĩa là ngôn ngữ đánh dấu siêu văn bản, nó được dùng để tạo ra trang web (tất cả những nội dung mà chúng ta nhìn thấy trên trang web, ví dụ như: văn bản, hình ảnh, liên kết, . . . . chính là được tạo ra dựa trên các thẻ HTML).
Ví dụ: Trước tiên, các bạn hãy truy cập vào trang https://thanhtungweb.com/file/danh-sach-hoc-bong.html. Sau đó bấm tổ hợp phím Ctrl + U hoặc nhấp chuột phải vào trang rồi chọn xem nguồn trang thì các bạn sẽ thấy một mớ bùa chú giống như hình bên dưới.
Đây là các thẻ HTML, chúng chính là nguồn gốc tạo ra những nội dung được hiển thị trên trang web.
Tìm hiểu khái niệm về thẻ trong HTML
Thẻ (tag) là một từ khóa được đặt bên trong cặp dấu ngoặc nhọn <…>.
Mỗi thẻ sẽ có một chức năng riêng, ví dụ:
- Thẻ <p> dùng để tạo một đoạn văn bản.
- Thẻ <a> dùng để tạo một cái liên kết.
- Thẻ <img> dùng để chèn một tấm hình vào trang web.
- ……
Thông thường thì thẻ được chia ra làm hai loại chính:
- Thẻ kép
- Thẻ đơn
Thẻ kép
Thẻ kép là loại thẻ mà khi chúng ta muốn sử dụng nó để tạo một nội dung gì đó cho trang web thì chúng ta cần phải dùng đến cả thẻ mở lẫn thẻ đóng (thẻ đóng có cách viết tương tự như thẻ mở, chỉ khác ở chỗ là phía trước tên của thẻ đóng thì có thêm một dấu gạch chéo).
Dưới đây là cú pháp sử dụng thẻ kép
<tagname>nội dung hiển thị</tagname>
Ví dụ: Thẻ <p> thuộc loại thẻ kép, để tạo được một đoạn văn bản giống như trong trang web nằm ở hình bên dưới thì chúng ta viết như sau
<p>Tài liệu học Lập Trình Web</p>
Thẻ đơn
Thẻ đơn là loại thẻ mà khi chúng ta muốn sử dụng nó để tạo một nội dung gì đó cho trang web thì chúng ta chỉ cần dùng mỗi thẻ mở (hay nói cách khác là nó không có thẻ đóng).
Ví dụ: Thẻ <img> thuộc loại thẻ đơn, để chèn một tấm hình vào trang web giống như ảnh minh họa nằm ở dưới thì chúng ta viết như sau:
<img src="https://thanhtungweb.com/file/image/face.jpg">
Thẻ lồng nhau
Thẻ lồng nhau thực chất chỉ là một trong những kỹ thuật cơ bản khi viết mã HTML, các thẻ được lồng vào nhau để xây dựng nên những nội dung đa dạng hơn.
Ví dụ: Tôi đặt thẻ <u> lồng bên trong thẻ <p> để xác định một cụm từ được gạch dưới chân, nó giúp cho nội dung của đoạn văn bản trở nên đa dạng hơn.
<p>Trung tâm <u>luyện thi</u> đại học</p>
Tuy nhiên có một điều mà các bạn cần phải lưu ý đó chính là các thẻ được phép lồng vào nhau, nhưng chúng tuyệt đối không được chéo nhau.
Ví dụ: Viết như bên dưới là sai quy tắc.
<p>Trung tâm <u>luyện thi</p> đại học</u>
Lưu ý: Trong ngôn ngữ HTML, khi chúng ta viết mã sai quy tắc thì màn hình trình duyệt sẽ không hiện lên bất kỳ một thông báo lỗi nào, chỉ là các nội dung sẽ không được hiển thị chính xác như mong đợi.
Tìm hiểu khái niệm tập tin HTML
Tập tin HTML là một loại tập tin văn bản mà bên trong nó có chứa các thẻ HTML, một tập tin HTML phải có phần đuôi là .html hoặc .htm
Lưu ý: Một tập tin HTML cũng có thể được gọi là:
- Một tài liệu HTML.
- Một trang HTML.
- Một trang web.
Giới thiệu loạt tài liệu hướng dẫn học HTML trên ThanhTungWeb.Com
Hiện nay có nhiều bạn muốn học HTML nhưng vì một vài lý do nào đó (chẳng hạn như điều kiện kinh tế hoặc trùng thời gian làm việc, . . . .) nên không thể đăng ký tham gia các khóa học tại các trung tâm hoặc khóa học trực tuyến, nên đã chọn cho mình con đường tự tìm kiếm tài liệu trên mạng.
Nắm bắt được nhu cầu đó, chúng tôi đã dành ra một khoảng thời gian khá dài để tổng hợp tất cả những kiến thức quan trọng trong HTML rồi biên soạn lại thành một “bộ tài liệu hướng dẫn học HTML” với mục đích tạo điều kiện cho các bạn có thể học HTML miễn phí, đồng thời làm chủ được thời gian học.
Bộ tài liệu này được biên soạn theo mức độ từ cơ bản đến nâng cao, mỗi bài viết đều đã được trau chuốt kỹ lưỡng, bài học trước sẽ cung cấp “kiến thức tiên quyết” cho bài học sau. Cho nên, ở mỗi bài học đều hết sức rõ ràng – mạch lạc – dễ hiểu.
Nếu bạn là một người đang học HTML thông qua hình thức tự tìm kiếm tài liệu trên mạng thì tôi nghĩ đây sẽ là một bộ tài liệu rất hữu ích dành cho bạn.
Các bạn có thể học bộ tài liệu HTLM này online mọi lúc mọi nơi thông qua trang ThanhTungWeb.Com này hoặc các bạn có thể Download bộ tài liệu hướng dẫn học HTML căn bản này lưu về máy tính của mình để học và thực hành.
