Phần tử khối và nội tuyến HTML
Mọi phần tử HTML đều có giá trị hiển thị mặc định, tùy thuộc vào loại phần tử đó là gì.
Có hai giá trị hiển thị: khối và nội tuyến.
Phần tử cấp khối
Một phần tử cấp khối luôn bắt đầu trên một dòng mới.
Một phần tử cấp khối luôn chiếm toàn bộ chiều rộng có sẵn (trải dài sang trái và phải hết mức có thể).
Phần tử mức khối có lề trên và lề dưới, trong khi phần tử nội tuyến thì không.
Thí dụ
<div>Hello World</div>
Dưới đây là các phần tử cấp khối trong HTML:
Phần tử nội tuyến
Một phần tử nội tuyến không bắt đầu trên một dòng mới.
Một phần tử nội tuyến chỉ chiếm nhiều chiều rộng khi cần thiết.
Đây là một phần tử <span> bên trong một đoạn văn.
Thí dụ
<span>Hello World</span>
Dưới đây là các phần tử nội tuyến trong HTML:
Lưu ý: Phần tử nội tuyến không được chứa phần tử cấp khối!
Phần tử <div>
Phần <div>tử thường được sử dụng làm vùng chứa cho các phần tử HTML khác.
Phần <div>tử không có thuộc tính bắt buộc, nhưng style, classvà idlà thông dụng.
Khi được sử dụng cùng với CSS, <div>phần tử có thể được sử dụng để tạo kiểu cho các khối nội dung:
Thí 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>
Phần tử <span>
Phần <span>tử là một vùng chứa nội tuyến được sử dụng để đánh dấu một phần của văn bản hoặc một phần của tài liệu.
Phần <span>tử không có thuộc tính bắt buộc, nhưng style, classvà idlà thông dụng.
Khi được sử dụng cùng với CSS, <span>phần tử có thể được sử dụng để tạo kiểu cho các phần của văn bản:
Thí dụ
<p>My mother has <span style="color:blue;font-weight:bold">blue</span> eyes
and my father has <span style="color:darkolivegreen;font-weight:bold">dark
green</span> eyes.</p>
Tóm tắt chương
- Có hai giá trị hiển thị: khối và nội tuyến
- Một phần tử cấp khối luôn bắt đầu trên một dòng mới và chiếm toàn bộ chiều rộng có sẵn
- Một phần tử nội tuyến không bắt đầu trên một dòng mới và nó chỉ chiếm nhiều chiều rộng khi cần thiết
- Phần
<div>tử là cấp khối và thường được sử dụng làm vùng chứa cho các phần tử HTML khác - Phần
<span>tử là một vùng chứa nội tuyến được sử dụng để đánh dấu một phần của văn bản hoặc một phần của tài liệu
Thẻ HTML
| Tag | Description |
|---|---|
| <div> | Defines a section in a document (block-level) |
| <span> | Defines a section in a document (inline) |
Để có danh sách đầy đủ tất cả các thẻ HTML có sẵn, hãy truy cập Tham khảo thẻ HTML của chúng tôi .