HTML cơ bản: Các thẻ cơ bản phần 1

Trong bài trước mình đã giới thiệu qua một chút cơ bản về HTML, bài này mình sẽ giới thiệu về các thẻ cơ bản thường gặp trong định dạng văn bản. Các thẻ này rất hữu ích trong việc hiển thị văn bản.

1.  Thẻ Heading.

Các thẻ heading được định nghĩa từ thẻ <h1> đến <h6> với size giảm dần.

<h1>Webzoomz.info</h1>

<h2>Webzoomz.info</h2>

<h3>Webzoomz.info</h3>

<h4>Webzoomz.info</h4>

<h5>Webzoomz.info</h5>

<h6>Webzoomz.info</h6>

Webzoomz.info

Webzoomz.info

Webzoomz.info

Webzoomz.info

Webzoomz.info

Webzoomz.info

Các thẻ heading được dùng để làm tiêu đề vì thế bạn nên tránh dùng chúng chỉ để làm cho một đoạn văn bản nào đó to hơn, thay vì các thẻ heading này bạn hãy dùng các thẻ định dạng khá để làm việc đó.

Thẻ H1 thường được sử dụng để hiển thị những tiêu đề chính và sau đó các thẻ H2,H3... dùng để hiển thị các đề mục con.

2. Các thẻ mức đoạn.

a. Thẻ address

Thẻ address được dùng để hiển thị các thông tin như tác giả, địa chỉ,chữ kí...

<address>

Written by <a href="mailto:webmaster@webzoomz.info">Le Thanh Tung</a>.<br>

Visit us at:<br>

webzoomz.info<br>

Hải Phòng

</address>

 b. Thẻ blockquote

Thẻ blockquote được sử dụng cho những phần trích dẫn và được hiển thị thụt vào đầu dòng.

<p>Đây là một ví dụ về sử dụng thẻ blockquote.</p>

<blockquote style="color:red">

   Nội dung cần trích dẫn ở

đây.

</blockquote>

<p>Đây là một ví dụ về sử dụng thẻ blockquote.</p>

Đây là một ví dụ về sử dụng thẻ blockquote.

Nội dung cần trích dẫn ở đây.

Đây là một ví dụ về sử dụng thẻ blockquote.

c.Thẻ pre

Khi chúng ta gõ văn bản trong code HTML và không chỉ định dạng cho nó thì lúc biên dịch ra và chạy trên trình duyệt thì chúng sẽ được định dạng lại. Nếu chúng ta muốn hiển thị văn bản theo định dạng mà chúng ta muốn và xác định từ trước trong code HTML thì chúng ta có thể sử dụng thẻ pre.

<p>Đây là một

đoạn văn bản

  không sử dụng thẻ pre.</p>

<pre> Đây là một

đoạn văn bản

sử dụng thẻ pre</pre>

Đây là một đoạn văn bản không sử dụng thẻ pre.

 Đây là một 

 đoạn văn bản 

  sử dụng thẻ pre

3. Thẻ khối(section) div, span

a. Thẻ div.

Thẻ div là thẻ được sử dụng khá nhiều trong việc chia tài liệu thành những sections. Nó được sử dụng để nhóm nội dung lại với nhau.

<div style="color:#00A803">

  <h3>Khối văn bản 1</h3>

  <p>Nội dung văn bản 1</p>

</div>

<div style="color:#8000A8">

  <h3>Khối văn bản 2</h3>

  <p>Nội dung văn bản 2</p>

</div>

<div style="color:#A80010">

  <h3>Khối văn bản 3</h3>

  <p>Nội dung văn bản 3</p>

</div>

Khối văn bản 1

Nội dung văn bản 1

Khối văn bản 2

Nội dung văn bản 2

Khối văn bản 3

Nội dung văn bản 3

b.Thẻ span

Tương tự như thẻ div nhưng phạm vi của thẻ span trong việc nhóm khối văn bản thì nhỏ hơn. Nó chỉ được dùng để nhóm một đoạn ngắn văn bản(thường là các kí tự và cụm từ có nội dung cần nhấn mạnh).

<p>Bài viết này sẽ giới thiệu về các thẻ <span style="color:#A80007;font-size:18px">cơ bản</span> thường gặp và hay sử dụng trong <span style="color:#228624;font-weight:bold">định dạng văn bản</span> của HTML</p>

Bài viết này sẽ giới thiệu về các thẻ cơ bản thường gặp và hay sử dụng trong định dạng văn bản của HTML.

4. Thẻ định dạng kí tự

Thẻ	Mô tả	Ví dụ
Thẻ B	in đậm	webzoomz.info
Thẻ TT	Cố định độ rộng văn bản	welcome to webzoomz.info
Thẻ SUP	Chỉ số trên	n10
Thẻ SUB	Chỉ số dưới	H2O
Thẻ EM	Nhấn mạnh văn bản	Chia sẻ đam mê
Thẻ CODE	Sử dụng trong trích dẫn(quote)code	3x+5y=20
Thẻ VAR	Sử dụng cho các biến trong chương trình	xyz
Thẻ CITE	Sử dụng cho các trích dẫn và tham chiếu	Webzoomz.info - Chia sẻ đam mê