HTML là gì? Phân loại thẻ HTML theo mục đích sử dụng

Bài viết này trình bày những điều cơ bản cần thiết nhất về HTML. Cho dù rằng bạn là người làm website chuyên nghiệp hay nghiệp dư cũng đều phải biết về nó. Hy vọng rằng bài viết này của LADIGI sẽ hữu ích đối với những ai đã và đang tìm hiểu về HTML.

1. HTML là gì?

HTML là từ viết tắt của cụm từ HyperText Markup Language hay tiếng Việt có thể dịch ra là Ngôn ngữ đánh dấu siêu văn bản. Nó được sử dụng để tạo trang web, đối với một website có thể chứa nhiều trang được gọi là một tài liệu HTML hay tập tin HTML. Người sáng lập ra HTML là ông Tim Berners- Lee hay cũng chính là người khai sinh ra tổ chức World Wide Web và chủ tịch của hộ World Wide Web Consortium – tổ chức thiết lập các tiêu chuẩn trên internet.

Một tập tài liệu HTML được hình thành bởi các phần tử HTML quy định bằng các các cặp thẻ hay còn gọi là tag. Cặp thẻ này thường được đặt trong dấu ngoặc nhọn <html> và thường được khai báo thành một cặp. Các văn bản muốn đánh dấu bằng HTML sẽ được khai báo bên trong cặp thẻ. Cũng có một số thẻ đặc biệt thì không có thẻ đóng và dữ liệu được nằm trong thuộc tính như <img>.

html là gì

HTML được gọi là ngôn ngữ đánh dấu siêu văn bản

2. HTML được xử lý như thế nào?

Sau khi tập tin HTML đã được tạo lập nên thì việc xử lý tập tin này sẽ do trình duyệt đảm nhận. Trình duyệt sẽ đọc hiểu nội dung của HTML từ các thẻ và chuyển sang văn bản để đọc, nghe hoặc hiểu.

Để kiểm tra bạn có thể chuyển qua phần HTML và Result để xem kết quả của tập tin HTML đã được tạo và sau khi qua xử lý thì như thế nào.

html-xu-ly

Ví dụ minh họa cách mà HTML được xử lý

3. Cấu trúc đoạn HTML và dùng chương trình gì tạo tập tin HTML

3.1. Cấu trúc của đoạn HTML như thế nào?

Như chúng ta đã biết thì HTML được khai báo bằng các phần tử bởi những từ khóa. Nội dung nằm bên trong đó là nội dung mà bạn cần định dạng với HTMl. Chúng ta có thể tham khảo ví dụ minh họa dưới đây để có thể khai báo một đoạn văn bản.

<p> Đây là một đoạn văn bản HTML.</p>

Và một điều quan trọng không thể không nhắc đến là trong thẻ còn có các thuộc tính. Thuộc tính thường đặt ở bên trong thẻ mở đầu. Mỗi một thuộc tính sẽ có giá trị được đặt trong ngoặc kép và cách nhau bằng dấu bằng (=) cùng với tên thuộc tính. Mỗi thẻ có thể sử dụng được nhiều thuộc tính.

<form action=http://thoitrang.com> </form>

the-html-vi-du

Ví dụ về một đoạn code HTML

3.2. Dùng chương trình gì để tạo tập tin HTML

HTML là dạng tập tin siêu văn bản nên có thể sử dụng chương trình soạn thảo không có chức năng định dạng để tạo tập tin dạng HTML. Với window bạn có thể dùng Notepad++, trên Mac có thể dùng Textedit. Điều quan trọng là sau cùng bạn phải lưu tập tin này dưới dạng .html và sử dụng trình duyệt web để đọc nó.

notepad html

Notepad++ là phần mềm thường được dùng viết code HTML

4. Phân loại thẻ HTML theo mục đích sử dụng

4.1. Thẻ HTML cơ bản

<!DOCTYPE> : Thẻ định nghĩa dạng tài liệu HTML

<html> : Thẻ này định nghĩa rằng đây là tài liệu HTML

<title>: Thẻ giúp định nghĩa tiêu đề của tập tin HTML

<body>:  Thẻ định nghĩa rằng từ đây là thân tập tin HTML

<h1> tới <h6>: Thẻ định nghĩa các mục chính trong tài liệu

<p>: Thẻ định nghĩa văn bản

<br>: Thẻ chèn xuống dòng

<hr> Thẻ định nghĩa thay đổi chủ đề trong nội dung

<!-…->: Thẻ định nghĩa một comment (thẻ này chỉ là ghi chú trong tập tin HTML, không hiện ra ngoài).

4.2. Thẻ HTML định dạng

<acronym>: Thẻ định nghĩa từ viết tắt, không được hỗ trợ trong HTML5.

<abbr>: Thẻ định nghĩa từ viết tắt.

<address>: Thẻ định nghĩa thông tin liên hệ cho tác giả.

<b>: Thẻ định nghĩa văn bản bôi đậm.

<bdi>: Thẻ này hữu ích khi nhúng nội dung người dùng tạo ra với một hướng chưa biết.

<bdo>: Thẻ định nghĩa hướng của văn bản.

<big>: Thẻ định nghĩa văn bản lớn hơn, không sử dụng trong HTML5, thường sử dụng CSS để thay thế.

<blockquote>: Thẻ định nghĩa nội dung được trích dẫn từ nguồn khác.

<center>: Định nghĩa một đoạn văn bản ở giữa, không được hỗ trợ HTML5.

<cite>: Thẻ định nghĩa tên sản phẩm.

<code>: Thẻ định nghĩa một đoạn code máy tính.

<del>: Thẻ định nghĩa rằng văn bản đã bị xóa từ một tài liệu.

<dfn>: Thẻ này thay thế định nghĩa cho thuật ngữ.

<em> Thẻ định nghĩa rằng văn bản phải được nhấn mạnh.

<font>: Định nghĩa phông, màu sắc và kích cỡ văn bản.

<i>: Tạo văn bản nghiêng trong HTML4.

<ins>: Thẻ định nghĩa văn bản được chèn vào tài liệu.

<kbd>: Thẻ định nghĩa thông tin người dùng nhập.

<mark>: Thẻ định nghĩa văn bản được đánh dấu.

<meter>: Thẻ đo lường dữ liệu trong một phạm vi.

<pre>: Thẻ định nghĩa dạng văn bản có sẵn.

<progress>: Thẻ mô tả tiến trình hoàn thành nhiệm vụ.

<q>: Thẻ định nghĩa nội dung trích dẫn từ nguồn khác.

<rp>: Thẻ định nghĩa sẽ hiển thị gì lên trên trình duyệt.

<rt>: Thẻ định nghĩa giải thích, phát âm ký tự.

<ruby>: Thẻ định nghĩa chú thích ruby dành cho kiểu chữ Đông Á,

<s>: Thẻ định nghĩa rằng văn bản không đúng nữa.

<samp>: Thẻ định nghĩa mẫu đầu ra từ chương trình máy tính.

<small>: Thẻ định nghĩa đoạn nhỏ hơn.

<strong>: Thẻ định nghĩa đoạn văn bản quan trọng.

<sub>: Thẻ định nghĩa chỉ số dưới.

<sup>: Thẻ định nghĩa chỉ số trên.

<time>: Thẻ định nghĩa ngày tháng và thời gian.

<u>: Thẻ định nghĩa văn bản có phong cách khác văn bản bình thường.

<var>: Thẻ định nghĩa một biến.

<wbr>: Thẻ định nghĩa một vị trí để xuống dòng.

4.3.  Thẻ nhập liệu HTML, Form và Input

<form>: Thẻ định dạng form HTML để nhập liệu.

<input>: Thẻ định nghĩa một điều khiển nhập liệu.

<textarea>: Thẻ này giống input nhưng là cả một vùng nhập liệu, không phải là một dòng.

<button>: Thẻ định nghĩa nút bấm.

<select>: Thẻ định nghĩa cả một danh sách thả xuống.

<optgroup>: Thẻ định nghĩa một nhóm lựa chọn trong danh sách thả xuống.

<option>: Thẻ định nghĩa một lựa chọn ở trong danh sách thả xuống.

<label>: Thẻ định nghĩa một nhãn cho thẻ input.

<fieldset>: Thẻ định nghĩa nhóm phần từ liên quan trong một form.

<legend>: Thẻ định nghĩa mô tả cho thẻ.

<datalist>: Thẻ chỉ định danh sách tùy chọn định trước.

<keygen>: Thẻ chỉ định cặp khóa sử dụng cho form.

<output>: Thẻ định nghĩa kết quả của phép tính.

4.4. Các khung

<frame>: Định nghĩa khung cửa sổ trong frameset.

<frameset>: Thẻ định nghĩa một bộ khung.

<noframes>: Thẻ định nghĩa nội dung thay thế cho người dùng nếu trình duyệt không có hỗ trợ nào cho thẻ frames.

<iframe>: Thẻ định nghĩa frame nhúng.

Tổng kết

Bài viết đã chia sẻ những kiến thức cơ bản nhất về HTML. Có thể bạn nghĩ rằng thông tin này chỉ mang tính chất tham khảo nhưng thực tế nó cực kỳ quan trọng, là nền tảng giúp bạn có thể học HTML chuyên sâu hơn, để có thể thiết kế website.

Thuật ngữ cần biết

html, table html, html là gì, format html, html online, html color, html beautifier, form html, button html, html format, beautiful html, checkbox html, blink html, html table, html editor, select html, color html, space html, w3school html, mã màu html, html to jsx, input html, học html, html 5, html code, html form, img html, iframe html, html template, format html online, lam dep html, radio button html, word to html, html decode, html checkbox, html css, comment html, html button, html to pdf, html encode, các thẻ trong html, thẻ div trong html, html beautify, html color code, form trong html, textarea html, code html, combobox html, html la gi, xuống dòng trong html

Công ty LADIGI chuyên cung cấp dịch vụ SEO và đào tạo SEO cho doanh nghiệp.

- Đào tạo SEO: ladigi.vn/seo/dao-tao-seo

- Dịch vụ SEO: ladigi.vn/seo/dich-vu-seo

Leave a Reply

Your email address will not be published. Required fields are marked *