Hướng dẫn thẻ p trong css

Chữ cái “p” trong thẻ

là viết tắt của paragraphs – đoạn văn. Thẻ p trong HTML giúp trình duyệt nhận dạng được đoạn văn bản trong HTML. Bài viết dưới đây sẽ giúp bạn phân biệt được các thẻ được dùng và không được dùng với thẻ

khi code HTML. 

Hướng dẫn thẻ p trong css
Nguồn: trickspanda

Mục lục

  • 1. Các thẻ được dùng với thẻ p trong HTML (thẻ bổ trợ thẻ p)
  • 2. Các thẻ không được dùng với thẻ p trong HTML
    • 2.1. Thẻ xác định danh sách 
    • 2.2. Các thẻ xác định bố cục trang web
    • 2.3. Các thẻ xác định bố cục nội dung

1. Các thẻ được dùng với thẻ p trong HTML (thẻ bổ trợ thẻ p)

Những thẻ được dùng trong thẻ

bao gồm: 

  • Thẻ liên kết
  • Thẻ
    Hướng dẫn thẻ p trong css
    Nguồn: nestify.io

    2.2. Các thẻ xác định bố cục trang web

    • Thẻ
      (phân chia khu vực)

    Thẻ phân chia khu vực hay vùng, sự phân chia này sẽ giúp cho trình duyệt hiểu rõ những vùng được bố cục trên trang web.

    • Thẻ
      (xác định phần nội dung nằm ở đầu trang web)

    Chứa tất cả phần đầu của trang web, gồm: logo, mô tả, liên kết, …

    • Thẻ
      (xác định khu vực có nội dung)

    Bao ngoài các nội dung lớn thường được đặt tiêu đề từ h2 đến h6 trong bài

    • Thẻ

    Tất cả phần sidebar chứa banner và các link dẫn tới mục bất kỳ của trang

    • Thẻ
      (xác định phần nội dung nằm ở cuối trang web)

    Chứa tất cả phần cuối của trang web, gồm: logo, bản quyền, thông tin doanh nghiệp (tên, mã số thuế, địa chỉ liên lạc,…)

    • Thẻ

    Chứa các liên kết giữa các trang với nhau.

    Hướng dẫn thẻ p trong css
    Nguồn: Unsplash

    2.3. Các thẻ xác định bố cục nội dung

    • Thẻ (định dạng tiêu đề bài viết)

    Gồm các thẻ từ

    cho đến

    , được dùng để xác định tiêu đề cho nội dung trên trang HTML. Nhờ các thẻ này, trình duyệt sẽ nhận biết được tiêu đề trên trang của một nội dung 

    • Thẻ
      (xác định một bài viết hoặc nội dung riêng biệt)

    Nội dung gồm các tin tức chi tiết, bài báo, …

    • Thẻ 
      (xác định chú thích của hình ảnh)

    Giải thích nội dung rõ nghĩa hơn cho hình ảnh

    Tóm lại, khi dùng thẻ p bạn chỉ cần nhớ những nhóm thẻ được dùng trong thẻ p thuộc nhóm inline. Còn lại, không được sử dụng các nhóm thẻ block chung với thẻ p trong HTML. 

  • Trang chủ
  • Hướng dẫn học
  • Hướng dẫn học HTML/HTML5
  • Thẻ định dạng đoạn văn bản

Thẻ định dạng đoạn văn bản

  • Thẻ

    viết tắt của từ "paragraphs" có nghĩa là đoạn văn.
  • Thẻ

    giúp trình duyệt xác định được đoạn văn bản trong trang HTML, thẻ này chỉ có thể chứa các thẻ thuộc nhóm inline, gồm: text, image, link, button,...

HTML viết





Tiêu đề trang web


Đây là đoạn văn


Hướng dẫn thẻ p trong css


Trong đoạn văn này có chứa liên kết



Hiển thị trình duyệt:

Đây là đoạn văn.

Hướng dẫn thẻ p trong css

Trong đoạn văn này có chứa liên kết.

Để ngắt đoạn cho đoạn văn ta có thể dùng 2 cách:

  • Ngắt đoạn cùng dòng: sử dụng thẻ
    (
    là thẻ thuộc nhóm inline).

HTML viết





Tiêu đề trang web


Đây là đoạn văn dài rất dài rất dài rất dài

rất dài rất dài rất dài rất dài.



Hiển thị trình duyệt:

Đây là đoạn văn dài rất dài rất dài rất dài
rất dài rất dài rất dài rất dài.

  • Ngắt đoạn khác dòng: sử dụng 2 thẻ

    để ngắt đoạn khác dòng, tránh trường hợp sử dụng 2 lần thẻ
    vì về mặt ý nghĩa của thẻ sẽ không còn chính xác, điều này sẽ gây khó khăn cho trình duyệt phân biệt đâu là cùng đoạn, đâu là khác đoạn.

HTML viết





Tiêu đề trang web


Đây là đoạn văn thứ nhất.


Đây là đoạn văn thứ hai.



Hiển thị trình duyệt:

Đây là đoạn văn thứ nhất.

Đây là đoạn văn thứ hai.

Những cấu trúc không nên sử dụng

Không được chứa bên trong

các thẻ thuộc nhóm các thẻ block, code như thế này là sai, không đúng chuẩn W3C:

HTML viết





Tiêu đề trang web


Đây là đoạn văn

Đây là đoạn văn



Tiêu đề

Nội dung




  • liên kết 01

  • liên kết 02