Giới thiệu

Tag <div> là một trong những tag phổ biến nhất trong HTML và được sử dụng để tạo ra các khối hoặc phần tử chứa nội dung trên trang web. "Div" là viết tắt của "division" (phân chia) và tag này thường được sử dụng để phân chia và nhóm các phần tử HTML lại với nhau.

Cách sử dụng

Để sử dụng tag <div>, bạn chỉ cần mở và đóng tag này bằng cách sử dụng cặp ký tự <div> và </div>. Bất kỳ nội dung nằm giữa cặp tag này sẽ được xem như là một khối riêng biệt trên trang web.

Ví dụ:

<div>
    <h1>Tiêu đề</h1>
    <p>Đây là một đoạn văn bản.</p>
    <img src="image.jpg" alt="Hình ảnh">
</div>

Trong ví dụ trên, chúng ta sử dụng tag <div> để nhóm các phần tử HTML như tiêu đề, đoạn văn bản và hình ảnh lại với nhau. Điều này giúp chúng ta quản lý và căn chỉnh các phần tử này một cách dễ dàng.

Giải thích

Tag <div> không có ý nghĩa ngữ nghĩa đặc biệt, nó chỉ đơn giản là một khối trống để chứa các phần tử khác. Tuy nhiên, tag này rất hữu ích trong việc tạo cấu trúc và tổ chức trang web.

Khi sử dụng tag <div>, bạn có thể áp dụng các thuộc tính CSS để tùy chỉnh kiểu dáng và bố cục của khối đó. Bạn có thể đặt id hoặc class cho tag <div> để áp dụng các quy tắc CSS riêng cho từng khối.

Ví dụ, bạn có thể sử dụng CSS để đặt kích thước, màu sắc, viền và căn chỉnh cho các khối <div> khác nhau trên trang web của bạn.

<style>
    .my-div {
        width: 300px;
        height: 200px;
        background-color: #f2f2f2;
        border: 1px solid #ccc;
        margin: 10px;
        padding: 20px;
        text-align: center;
    }
</style>

<div class="my-div">
    <h2>Khối 1</h2>
    <p>Đây là nội dung của khối 1.</p>
</div>

<div class="my-div">
    <h2>Khối 2</h2>
    <p>Đây là nội dung của khối 2.</p>
</div>

Trong ví dụ trên, chúng ta đã định dạng các khối <div> bằng CSS thông qua class "my-div". Các khối này có kích thước, màu sắc, viền, margin, padding và căn chỉnh khác nhau.

Tag <div> là một công cụ mạnh mẽ để tạo cấu trúc và tổ chức trang web của bạn. Bằng cách sử dụng tag này và kết hợp với CSS, bạn có thể tạo ra các bố cục phức tạp và tùy chỉnh trang web của mình theo ý muốn.