NTM Solutions

Chủ Nhật, 4 tháng 12, 2016

Tự học HTML - Bài 14 - Xử lý khối văn bản

Các thẻ nhóm

Thẻ
Mô tả
Xác định 1 khối văn bản (block-level)
Xác định 1 dòng văn bản (inline)

Giá trị mặc định về mặt hiển thị của phần lớn các thẻ HTML là block hoặc inline.

Các thẻ cấp độ Block-level

Một phần tử block-level luôn bắt đầu bằng 1 dòng mới kéo dài đến hết dòng từ trái qua phải.
The <div> element is a block-level element.
01 vài phần tử cấp độ block-level
  • <div>
  • <h1> - <h6>
  • <p>
  • <form>

Các thẻ cấp độ Inline

Các thẻ ở cấp độ này chỉ chiếm hết 1 dòng duy nhất.
This is an inline <span> element inside a paragraph.
01 vài phần tử cấp độ inline:
  • <span>
  • <a>
  • <img>

Thẻ <div>

Thẻ <div> thường được dùng để chứa các thẻ HTML khác.
Thẻ <div> không cần phải có các thuộc tính, nhưng ta thường dùng 02 thuộc tính style và class để định dạng.
Khi dùng kết hợp với CSS, thẻ <div> thường sử dụng kiểu nội dung khối:

Ví dụ:

<div style="background-color:black;color:white;padding:20px;">
  
<h2>London</h2>
  
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>

Thẻ <span>

Thẻ <span> thường dùng để chứa văn bản.
Thẻ <span> không đòi hỏi phải dùng thuộc tính, nhưng ta thường dùng 02 thuộc tính style và class.
Khi kết hợp với CSS, thẻ <span> thường được dùng chứa 1 phần của đoạn văn bản:

Ví dụ:


<h1>My <span style="color:red">Important</span> Heading</h1>