Đề mục là gì? – Thẻ đề mục trong HTML – Học HTML


LinkVietVip.Com là một website miễn phí, nơi mà bạn có thể rút gọn liên kết miễn phí và kiếm thu nhập từ việc chia sẻ liên kết rút gọn đó của mình.
Download, Tải về, Tải Xuống, Down,Mở,Xem, Open, Load, Tiếp Tục,Chơi, Chơi Game,Continue, Reading,Xem tiếp, Xem thêm, Chuyển hướng tới địa chỉ bên ngoài vui lòng xem bên dưới.

Đề mục rất quan trọng trong một trang HTML. Đề mục ngoài yếu tố nhấn mạnh làm tiêu đề của một đoạn nội dung và làm đẹp cho trang nó cũng là một yếu tố rất quan trọng cho SEO. Ở bài viết này chúng ta sẽ cùng nhau tìm hiểu về Đề mục trong HTML, Cách xem mã nguồn một trang web và một số thẻ tiêu đề khác.

Đề mục trong HTML là gì?

Đề mục là gì?

  • Đề mục là một tên gọi, tiêu đề cho một đoạn hoặc một số đoạn văn bản, nói lên nội dung tóm gọn và nổi bật của đoạn văn bản đó.
  • Đề mục thường để gọi tên một phần lớn trong một bài viết.

Đề mục trong HTML

Đề mục trong html được định nghĩa bằng các thẻ từ <h1> đến <h6>

<h1> sử dụng để định nghĩa đề mục quan trọng nhất trong trang. <h6> sử dụng để định nghĩa đề mục ít quan trọng hơn trong trang. Tức là độ ưu tiên của đề mục giảm dần từ h1 đến h6.

Dán đoạn code sau vào trình soạn thảo và chạy để hiểu rõ hơn:

<!DOCTYPE html>
<html>
<body>
<h1>Đây là tiêu đề 1</h1>
<h2>Đây là tiêu đề 2</h2>
<h3>Đây là tiêu đề 3</h3>
<h4>Đây là tiêu đề 4</h4>
<h5>Đây là tiêu đề 5</h5>
<h6>Đây là tiêu đề 6</h6>
</body>
</html>

Lưu ý: Các trình duyệt sẽ tự động thêm khoảng trống ở trên và dưới mỗi đề mục.

Sự quan trọng của đề mục

Chỉ sử dụng các thẻ từ h1 đến h6 cho đề mục. Không sử dụng các thẻ đề mục để làm chữ TO hoặc đậm.

Các bộ máy tìm kiếm sẽ sử dụng những đề mục để đánh dấu cấu trúc và nội dung website của bạn.

Người dùng sẽ đọc và định nghĩa bài viết của bạn dễ dàng hơn thông qua các đề mục, vì vậy việc sử dụng đề mục để hiển thị cấu trúc trang là rất quan trọng.

Thẻ h1 dùng để đánh dấu đề mục chính, sau đó đến thẻ h2, h3… tùy thuộc vào độ quan trọng của đề mục.

Dòng kẻ ngang <hr>

Sử dụng thẻ <hr> để tạo đường kẻ ngang trong trang HTML.

Thẻ hr có tác dụng tách biệt giữa các nội dung với nhau:

<!DOCTYPE html>
<html>
<body>
<p>Thẻ hr dùng để tạo một dòng kẻ ngang tách các nội dung:</p>
               <hr>
<p>Đây là một đoạn văn bản.</p>
               <hr>
<p>Đây là một đoạn văn bản.</p>
               <hr>
<p>Đây là một đoạn văn bản.</p>
</body>
</html>

Thẻ <head> trong HTML

Thẻ <head> không liên quan gì tới các đề mục trong HTML.

Thẻ <head> chỉ dùng để chứa những dữ liệu bổ sung, không được hiển thị trên trang.

Thẻ <head> được đặt ở trong thẻ <html> và trên thẻ <body>:

<!DOCTYPE html>
<html>
<head>
<title>Trang web đầu tiên của tôi</title>
<meta charset="UTF-8">
</head>
<body>
<p>Thẻ head dùng để chứa các siêu dữ liệu (meta data).</p>
<p>Siêu dữ liệu là những dữ liệu bổ sung cho trang HTML.</p>
</body>
</html>

Thẻ <title> trong HTML

Thẻ <title> dùng để đặt và hiển thị tên tiêu đề của 1 trang HTML.

Tiêu đề này sẽ không hiển thị trên nội dung của trang nhưng sẽ được hiển thị trên thanh tiêu đề của trình duyệt.

Chạy ví dụ sau để hiểu rõ hơn:

<!DOCTYPE html>
<html>
<head>
<title>Đây là tiêu đề của trang</title>
<meta charset="UTF-8">
</head>
<body>
</body>
</html>

Thẻ <meta> trong HTML

Thẻ <meta> ( Thẻ dữ liệu) được dùng để định nghĩa mã ký tự và các thông tin khác cho trang HTML. Thẻ <meta> được sử dụng bên trong thẻ <head>

Các thẻ dữ liệu khác

Trong bài học về trang trí HTML bạn sẽ biết nhiều hơn về các thẻ:

Thẻ <style> dùng để định nghĩa các kiểu CSS trong trang.

Thẻ <link> dùng để liên kết tới một tệp tin CSS trong thư mục nào đó hoặc bên ngoài trang web.

Cách xem mã nguồn một trang web

Bạn đã bao giờ nhìn thấy một trang web rất đẹp và tự hỏi “Này! Làm sao họ làm được như thế nhỉ?”

Rất đơn giản, bạn nhấn chuột phải vào một khoảng trống trong trang và chọn “View Page Source” (trong Chrome) hoặc “View Source” (trong IE), hoặc những câu tương tự trong các trình duyệt khác. Sau đó trình duyệt sẽ mở ra một cửa sổ (hoặc tab) mới chứa mã HTML của trang.

Tổng kết:

Trong bài viết này chúng ta đã tìm hiểu về cách dùng tác dụng của một số thẻ:

ThẻMiêu tả
<html>Định nghĩa trang HTML
<body>Nội dung trang HTML
<head>Thành phần bổ sung thông tin cho trang HTML
<h1> đến <h6>Tạo đề mục
<hr>Tạo dòng kẻ ngang
<meta> Định nghĩa mã ký tự và các thông tin khác
<title> Hiển thị tiêu đề trang trên đầu trình duyệt

Và cách xem mã nguồn một trang web bạn muốn.

Nếu có bất kỳ thắc mắc hay góp ý nào cho bài viết này, hãy để lại bình luận cho tôi phía dưới nhé. Chúc các bạn học tốt với HTML Online ^^.



Be the first to comment

Leave a Reply

Your email address will not be published.


*