Thẻ định Dạng Tiêu đề | Hướng Dẫn Học

Có thể bạn quan tâm

Thẻ định dạng tiêu đề
  • Trang chủ
  • Hướng dẫn học
  • Hướng dẫn học HTML/HTML5
  • Thẻ định dạng tiêu đề

Định nghĩa và cách dùng

  • Thẻ <hx>: chữ "h" viết tắc của từ "headings" nghĩa là đề mục, hoặc tiêu đề.
  • Thẻ <hx> : Sử dụng để định nghĩa tiêu đề cho nội dung HTML, giúp cho trình duyệt nhận biết được tiêu đề của một nội dung.
  • Thẻ <hx> có giá trị từ <h1> tới <h6>, trong đó mức độ quan trọng giảm từ <h1> tới <h6> (hay ta có thể hiểu: tiêu đề lớn nhất là <h1>, và tiêu đề nhỏ nhất là <h6>).
  • Nội dung bên trong <hx></hx> chỉ nên chứa các thẻ thuộc nhóm inline.
  • Thẻ <hx></hx> chỉ nên thể hiện tiêu đề, không dùng cho mục đích khác.

Html viết:

<!DOCTYPE html> <html> <head> <meta charset=utf-8" /> <title>Tiêu đề trang web</title> </head> <body> <h1>Đây là tiêu đề quan trọng nhất (lớn nhất)</h1> <h2>Đây là tiêu đề quan trọng thứ nhì (lớn thứ nhì)</h2> <h3>Đây là tiêu đề quan trọng thứ ba (lớn thứ ba)</h3> <h4>Đây là tiêu đề quan trọng thứ tư (lớn thứ tư)</h4> <h5>Đây là tiêu đề quan trọng thứ năm (lớn thứ năm)</h5> <h6>Đây là tiêu đề ít quan trọng nhất (nhỏ nhất)</h6> </body> </html>

Hiển thị trình duyệt:

Đây là tiêu đề quan trọng nhất (lớn nhất)

Đây là tiêu đề quan trọng thứ nhì (lớn thứ nhì)

Đây là tiêu đề quan trọng thứ ba (lớn thứ ba)

Đây là tiêu đề quan trọng thứ tư (lớn thứ tư)

Đây là tiêu đề quan trọng thứ năm (lớn thứ năm)
Đây là tiêu đề ít quan trọng nhất (nhỏ nhất)

Thẻ <h1> là thẻ quan trọng nhất trong trang HTML, trong một trang html thường người ta sử dụng <h1> một lần duy nhất cho logo, hoặc dòng mô tả trang web (mục đích SEO), mục đích của <h1> là khai báo cho trình duyệt biết đâu là phần quan trọng nhất của trang web.

HTML viết

<!DOCTYPE html> <html> <head> <meta charset=utf-8" /> <title>Tiêu đề trang web</title> </head> <body> <h1>Logo</h1> <h2>Tiêu đề lớn</h2> <p>Nội dung của tiêu đề lớn</p> <h3>Tiêu đề nhỏ</h3> <p>Nội dung của tiêu đề nhỏ</p> </body> </html>

Hiển thị trình duyệt:

Logo

Tiêu đề lớn

Nội dung của tiêu đề lớn

Tiêu đề nhỏ

Nội dung của tiêu đề nhỏ

Những cấu trúc không nên sử dụng

Không được chứa bên trong <hx></hx> các thẻ thuộc nhóm các thẻ block, code như thế này là sai, không đúng chuẩn W3C:

HTML viết

<!DOCTYPE html> <html> <head> <meta charset=utf-8" /> <title>Tiêu đề trang web</title> </head> <body> <h1><p>Đây là đoạn văn</p></h1> <h2><div>Đây là đoạn văn</div></h2> <h3> <dl> <dt>Tiêu đề</dt> <dd>Nội dung</dd> </dl> </h3> <h2> <ul> <li>liên kết 01</li> <li>liên kết 02</li> </ul> </h2> </body> </html>

Tham khảo thêm

  • <!Doctype>
  • <html></html>
  • <head></head>
  • <body></body>
  • <hx></hx>

Các thẻ định dạng nội dung

Thẻ định dạng đoạn văn bản

HỌC WEB CHUẨN

HƯỚNG DẪN HỌC

Hướng dẫn học XHTML & HTML5

  • Hướng dẫn học XHTML & HTML5
  • Giới thiệu về HTML
  • Cấu trúc cơ bản của HTML
  • Nhóm các thẻ block

    • <h1> - <h2> - <h3> - <h4> - <h5> - <h6>
    • <p>
    • <div>
    • <dl> - <dt> - <dd>
    • <ul> - <ol> - <li>
    • <nav>
    • <header>
    • <section>
    • <article>
    • <aside>
    • <footer>
    • <figure> - <figcaption>
  • Nhóm các thẻ inline

    • <a>
    • <img />
    • <br />
    • <span>
    • <strong>
    • <em>
  • Xem thêm ví dụ về HTML
  • Bài tập HTML & HTML5 cơ bản
  • Bài tập HTML & HTML5 nâng cao

Hướng dẫn học XHTML & HTML5

Bài tập HTML & HTML5

Hướng dẫn học CSS

Hướng dẫn học CSS3

Bài tập CSS & CSS3

Hướng dẫn học SCSS

Hướng dẫn học Responsive

Hướng dẫn học jQuery

Bài tập jQuery

Hướng dẫn học ES6

Hướng dẫn học React.js

Hướng dẫn học Webpack

Hướng dẫn XAMPP

Hướng dẫn học PHP

Hướng dẫn học Laravel

Hướng dẫn học htaccess

THAM KHẢO

  • Tham khảo
  • Tham khảo HTML4/XHTML
  • Tham khảo HTML5
  • Tham khảo CSS
  • Tham khảo CSS3
  • Tham khảo jQuery

CHUYÊN ĐỀ

  • Chuyên đề
  • Chuyên đề HTML/CSS
  • Chuyên đề HTML5/CSS3
  • Chuyên đề jQuery/JS
  • jQuery/JS plugin

GÓP Ý - LIÊN HỆ

  • CÔNG CỤ TẠO CSS3CSS3 GENERATOR
  • BỘ CÔNG CỤGENERATOR TOOLS
  • CÔNG CỤ HỖ TRỢWEB TOOLS
  • CÔNG CỤ TẠO RANDOMRANDOM GENERATOR
  • CÔNG CỤ KIỂM TRA RESPONSIVE TEST
  • CHIA SẺ HAYWEB & TOOLS
  • Follow us on hocwebchuan.com
  • Short URL
  • Rabbie theme

Từ khóa » H1 Trong Php