Thẻ div trong html là gì? Để tạo khối các khối giao diện.

the div trong html

Thẻ div trong HTML cho phép bạn nhóm các tập hợp nội dung tương tự lại với nhau trên một trang website. Bạn cũng có thể sử dụng nó như một vùng chứa chung để liên kết các nội dung tương tự.

Trong bài viết này, Blogchiase.vn sẽ giải thích rõ cho bạn thẻ div là gì? Chỉ rõ cho bạn những thứ khác nhau mà bạn có thể làm với thẻ div, cách tạo khối cho nó. Đặc biệt là bạn sẽ biết được những trình duyệt nào hỗ trợ cho thẻ div. Hãy cùng tìm hiểu nhé!

Thẻ div trong html là gì?

Div (viết tắt của từ “division”) là thẻ được dùng để nhóm nhiều phần tử HTML lại với nhau. Mỗi một thẻ trong HTML đều có mục đích sử dụng khác nhau. Ví dụ như thẻ <p> (viết tắt của từ “paragraph”) được dùng để chỉ một đoạn văn bản nhất định; hoặc là thẻ <br> dùng để ngắt đoạn văn bản trong HTML.  Thẻ <div> là thẻ dùng để đánh dấu một khối (block) gồm nhiều thẻ khác trong khối. Thẻ <div> giúp cho các tài liệu trong HTML được chia thành các phần riêng biệt.

Cú pháp thẻ div như sau:

the div la gi
Bạn cũng có thể tạo nhiều thẻ div lồng nhau như sau:
the div trong html la gi
Thẻ div trong html là gì

Đương nhiên là lạm dụng quá nhiều thẻ HTML trong một giao diện sẽ ảnh hưởng đến tốc độ tải trang, SEO .. và nhiều yếu tố khác. Vì vậy, với những người làm frontend kinh nghiệm thì họ sẽ rất hạn chế sử dụng quá nhiều cấp HTML.

Tác dụng của thẻ div trong HTML.

Thẻ div được dùng để nhóm các phần tử lại với nhau trong các khu vực của website. Các khu vực đó bao gồm: header (nhóm nội dung ở đầu trang web), global navigation (liên kết giữa các trang trong website), page body (thân nội dung của trang), content (gồm text và hình ảnh của bài), sidebar (nội dung phụ chạy dọc hai bên trái phải trang web), footer (nhóm nội dung ở cuối trang web).

tac dung the div trong html
Tác dụng của thẻ div trong HTML.

Ngoài ra, một số cấu trúc hoặc các khu vực lớn bên trong chứa nhiều thẻ cũng được khuyên dùng thẻ div để phân nhóm. Việc nhóm các cấu trúc lại bằng thẻ <div></div> sẽ giúp cho quá trình định dạng, điều khiển,… nguyên cụm dễ dàng hơn rất nhiều. Người dùng chỉ cần thêm hoặc bớt đặc tính bằng một dòng có gắn thẻ div là khối nội dung đó sẽ thay đổi như yêu cầu.

Thẻ span và thẻ div khác nhau như thế nào?

Thẻ span và thẻ div có chung tác dụng là nhóm các phần tử trong HTML, vậy nên chúng thường bị nhầm lẫn khi sử dụng. Vậy cụ thể sự khác biệt giữa 2 thẻ span và div là gì?

su khac nhau giua the span va the div
Sự khác nhau giữa thẻ span và thẻ div

Cụ thể, thẻ div gom các phần tử theo khối (block), nhóm các phần tử thành một khối. Trong khi đó, thẻ span gom các phần tử một dòng (inline), nhóm các hình ảnh, văn bản thành một nhóm nhỏ. Một cách dễ hiểu, thẻ span dùng cho một nhóm nội dung đơn lẻ, còn thẻ div dùng với các khối (gồm nhiều nhóm nội dung).

the div trong html
Thẻ div trong html

Trên đây là định nghĩa về thẻ div và những lưu ý trong quá trình sử dụng thẻ div để phân nhóm nội dung. Trong quá trình code HTML, bạn nên nắm được những thẻ không dùng chung với thẻ div là gì để tránh, giúp cho quá trình tải trang web được tối ưu.

Trả lời

Email của bạn sẽ không được hiển thị công khai.