Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Cách tạo khu vực (section) trong tài liệu HTML?

Thẻ <div> (division) là container chung để nhóm các phần tử thành một khu vực (section) để định dạng bằng CSS hoặc thao tác bằng JS. Không mang ngữ nghĩa — chỉ dùng khi không có thẻ semantic phù hợp (<section>, <article>, <aside>, <nav>, <header>, <footer>, <main>).

Ví dụ

<!DOCTYPE html>
<html>
  <head>
    <title>Thẻ div HTML</title>
    <style>
      #contentinfo p {
        line-height: 1.6; margin: 1.5rem; padding-bottom: 1.25rem;
        text-align: justify; width: 140px; color: red;
      }
    </style>
  </head>
  <body>
    <div id="contentinfo">
      <p>Chào mừng đến website. Chúng tôi cung cấp hướng dẫn các chủ đề.</p>
    </div>
  </body>
</html>

Semantic HTML5 thay thế div

Thẻ Dùng cho
<main>Nội dung chính duy nhất của trang
<section>Khu vực theo chủ đề (có heading)
<article>Tác phẩm độc lập
<aside>Nội dung phụ (sidebar, quảng cáo)
<nav>Điều hướng chính
<header>/<footer>Đầu/cuối trang hoặc section

Khuyến nghị

  • Ưu tiên thẻ semantic — tốt cho SEO, accessibility, maintainability.
  • Dùng <div> chỉ khi: wrapper cho layout (grid/flex), hook JS, không có semantic phù hợp.