Block trong HTML




Tất cả các phần tử trong HTML có thể được chia thành hai loại: các phần tử cấp khốicác phần tử nội tuyến.

Phần tử cấp khối trong HTML

Phần tử cấp khối thường bắt đầu và kết thúc với một dòng mới khi hiển thị trong trình duyệt. Ví dụ cho các phần tử này là

,

,

,

,

,

,
,
    ,
      ,
      ,
      , 
      ,
      , và
      . Tất cả chúng bắt đầu bởi một dòng mới, và bất cứ cái gì theo sau chúng, đều xuất hiện trên dòng mới này.

      Phần tử nội tuyến trong HTML

      Các phần tử nội tuyến xuất hiện trong một câu và không cần phải cách dòng. Ví dụ cho các phần tử này là , , , , , , , , ,

    1. , , , , , , , và .

      Tạo nhóm các phần tử HTML trong HTML

      Có 2 thẻ quan trọng mà chúng ta sử dụng thường xuyên để tạo nhóm các thẻ HTML khác là (i)

      và (ii) .

      Thẻ
      trong HTML

      Đây là một thẻ cấp khối rất quan trọng đóng vai trò lớn trong việc tạo nhóm các thẻ HTML khác và áp dụng CSS trong nhóm các phần tử. Ngay trong hiện tại thì thẻ

      có thể được sử dụng để tạo cách bố trí (layout) cho web, tại đây chúng ta xác định các phần khác nhau (trái, phải, trên,…) của trang bằng cách sử dụng thẻ này. Thẻ này không cung cấp bất cứ sự thay đổi về thị giác trên khối nhưng nó có nhiều ý nghĩa hơn khi được sử dụng cùng với CSS.

      Ví dụ

      Dưới đây là một ví dụ đơn giản về việc sử dụng thẻ

      . Chúng ta sẽ học về CSS trong một chương riêng, nhưng tại đây chúng ta sử dụng nó để thấy sự hữu ích khi dùng thẻ
      :

      
      
      
      Vi du the div trong HTML
      
      
      

      Day la nhom dau tien

      Danh sach cac loai rau

      • Beetroot
      • Ginger
      • Potato
      • Radish

      Day la nhom thu hai

      Danh sach cac loai trai cay

      • Apple
      • Banana
      • Mango
      • Strawberry

      Nó sẽ tạo ra kết quả sau:

      Day la nhom dau tien

      Danh sach cac loai rau

      • Beetroot
      • Ginger
      • Potato
      • Radish

      Day la nhom thu hai

      Danh sach cac loai trai cay

      • Apple
      • Banana
      • Mango
      • Strawberry

      Thẻ trong HTML

      Thẻ là một phần tử nội tuyến và có thể được sử dụng để tạo nhóm nội tuyến trong tài liệu HTML. Thẻ này cũng không cung cấp bất cứ sự thay đổi về thị giác trên khối, nhưng nó có nhiều ý nghĩa hơn khi sử dụng cùng với CSS.

      Sự khác nhau giữa thẻ và thẻ

      là thẻ được sử dụng với các phần tử nội tuyến trong khi thẻ
      được sử dụng với các phần tử cấp khối.

      Ví dụ

      Dưới đây là ví dụ đơn giản về thẻ . Chúng ta sẽ học CSS ở một chương riêng nhưng hiện tại chúng ta tìm hiểu nó để thấy sự hữu ích của thẻ này:

      
      
      
      Vi du the span trong HTML
      
      

      Day la mau do va day la mau xanh

      Nó tạo kết quả sau:

      Day la mau do va day la mau xanh