Khám phá về các phần tử block trong HTML

Các phần tử HTML được chia thành 2 loại chính: Phần tử Block Element (phần tử khối) và Phần tử Inline Element (phần tử nội tuyến). Hãy tham khảo bài viết dưới đây để hiểu rõ hơn về phần tử block trong HTML.

Hiểu rõ hơn về phần tử block trong HTML

1. Các phần tử block trong HTML

1.1 Các phần tử khối (Block Element) trong HTML

Một thành phần khối (block element) thường bắt đầu trên dòng mới và chiếm toàn bộ chiều rộng có sẵn.
Thẻ div là một thành phần khối.
Ví dụ: ví dụ dưới đây minh họa các phần tử khối trong HTML:

Sau khi sử dụng phần tử khối, kết quả hiển thị như sau:

Dưới đây là danh sách các phần tử khối trong HTML:

1.2 Các phần tử nội tuyến (Inline Element) trong HTML

Các phần tử nội tuyến (Inline Element) trong HTML không bắt đầu từ dòng mới và chỉ chiếm một phần chiều rộng vừa đủ.
Ví dụ: tham khảo ví dụ dưới đây để hiểu về các phần tử nội tuyến (Inline Element) trong HTML:

Sau khi áp dụng phần tử nội tuyến, kết quả sẽ như sau:

Dưới đây là danh sách các phần tử nội tuyến trong HTML:

1.3 Thẻ div trong HTML

Thẻ div trong HTML thường được sử dụng để bao gồm các phần tử HTML khác.
Thẻ div không yêu cầu các thuộc tính, tuy nhiên style, class và id là các thuộc tính phổ biến.
Khi kết hợp với CSS, thẻ div có thể được sử dụng để xác định kiểu block (khối) cho nội dung.
Ví dụ: tham khảo ví dụ minh họa dưới đây để hiểu rõ hơn về thẻ div trong HTML:

Sau khi sử dụng phần tử div, kết quả sẽ như sau:

1.4 Thẻ span trong HTML

Sau khi áp dụng phần tử span, kết quả sẽ như sau:

2. Tóm tắt

Dưới đây là danh sách các thẻ trong HTML:

Trong bài viết này, Mytour vừa giới thiệu về phần tử block (khối) trong HTML. Nếu có bất kỳ thắc mắc hoặc câu hỏi nào cần được giải đáp, bạn đọc có thể để lại ý kiến trong phần bình luận dưới bài viết để nhận câu trả lời và cải thiện kỹ năng HTML. Trong các bài viết tiếp theo, Mytour sẽ tiếp tục giới thiệu về thuộc tính class trong HTML.