Các thẻ cơ bản trong HTML (HTML Tag)

Ở bài viết trước mình đã giới thiệu với các bạn sơ qua về HTML,  hôm nay mình sẽ giới thiệu với các bạn một số thành phần cơ bản (các thẻ hay dùng nhất trong HTML).

tham khảo: http://www.ewebvn.com/

Một tài liệu HTML được tạo nên từ các cặp thẻ html

• Thẻ HTML được bắt đầu bằng dấu < (dấu nhỏ hơn) và kết thúc bằng dấu > (dấu lớn hơn)
• Nội dung nằm giữa dấu <> là tên thẻ. Ví dụ <b>, ta đọc là thẻ b
• Cặp thẻ HTML được tạo nên từ thẻ mở và thẻ đóng
• Các tag đầu tiên trong một cặp là thẻ bắt đầu, các thẻ thứ hai là thẻ kết thúc
• Thẻ Bắt đầu và thẻ kết thúc còn được gọi là thẻ mở và thẻ đóng
• Thẻ đóng kết thúc bằng dấu / (</tenthe>)
• Nội dung của thẻ sẽ được nằm giữa thẻ đóng và thẻ mở
• Một số thẻ chỉ có thẻ mở mà không có thẻ đóng (như các thẻ <img>, <br />,  <hr />)

Ví dụ về cặp thẻ: <b>Nội dung thẻ</b>

Các thẻ thường sử dụng trong HTML

1. Các thẻ tiêu đề (HTML Headings)

• Bao gồm các thẻ từ <h1> đến <h6>: thường được sử dụng để thể hiện cho tiêu đề bài viết, bản tin, các mục nhấn mạnh . . .
• Font chữ (size) của nội dung trong các thẻ giảm từ <h1> đến <h6> (h1 lớn nhất, h6 nhỏ nhất).
• Ví dụ:

1	<h1>Nội dung thẻ h1</h1>

2

3	<h2>Nội dung thẻ h2</h2>

4

5

...

6

7	<h6>Nội dung thẻ h6</h6>

2. Đoạn văn bản trong HTML (HTML Paragraphs)
Đoạn văn bản trong tài liệu HTML được định nghĩa bằng thẻ <p>
Ví dụ

1	<p>Nội dung đoạn văn bản thứ nhất.</p>

2	<p>Đoạn văn bản thứ 2.</p>

3. Liên kết (HTML Links)

• Một trang website bao gồm rất nhiều trang web (web page), các web page liên kết lại với nhau để tạo lên website.
• Liên kết trong HTML được định nghĩa bằng cặp thẻ <a>

Ví dụ:

1	<a href="http://google.com.vn" target="_blank">Google pages</a>

Các thuộc tính (Attribute) của thẻ <a>

1. href: quy định địa chỉ (url) mà liên kết trỏ tới
2. target: (đích) thuộc tính này sẽ quy định liên kết sẽ được mở ra ở đâu: _self (trang hiện tại), _blank (cửa sổ mới), . .

4. HTML images (Hình ảnh)

Để chèn hình ảnh vào tài liệu HTML ta sử dụng thẻ <img>, đây là thẻ HTML không có thẻ đóng

Ví dụ:

1	<img src="logo.jpg" width="100px" height="40px" />

Các thuộc tính của thẻ <img>

• src=”logo.jpg”: chỉ ra đường dẫn tập tin hình ảnh (có thể là đường dẫn tuyệt đối hoặc tương đối, vấn đề này mình sẽ giải thích ở một topic khác)
• alt=”Logo”:  nội dung sẽ được hiển thị khi đường dẫn tới tập tin hình ảnh không tồn tại
• title=”Logo”: nội dung hiển thị khi đưa trỏ chuột lên hình.
• width, height: độ rộng và độ cao của file hình được tính bằng px, nếu không có thuộc tính width, height thì mặc định sẽ lấy kích thước gốc của file hình

HTML Lines (<hr />)

Thẻ <hr /> sẽ tạo một đường kẻ ngang trong trang HTML. <hr /> là thẻ đơn không có thẻ đóng

1

<hr/>

HTML Line Breaks <br/>
Sử dụng <br /> để xuống dòng trong một đoạn văn bản

Ví dụ

1	<p>Xuống dòng<br />trong<br />đoạn văn bản</p>

Tuy nhiên chúng ta không nên sử dụng thẻ <br /> trong tài liệu HTML (khuyến cáo)

Các thẻ định dạng text (HTML Text Formatting)
<b> (bold): Chữ In đậm

1	<b>This text is bold</b>

<i> (italic): Chữ in nghiên

1	<i>This text is italic</i>

<u> (Underline): Chữ gạch chân

1	<u>This text is underline</u>

<big> (Big): Chữ lớn hơn

1	<big>This text is big text</big>

<sub> (Subscrip) Chỉ số dưới, ví dụ: H₂O

1	<p>H<sub>2</sub>O</p>

<sup> (Superscript): Chỉ số trên, ví dụ: x²y

1	<p>x<sup>2</sup>y</p>

<strong> In đậm (nhấn mạnh <b>)

1	<strong>This text is strong</strong>

<em>(emphasized): Chữ in nghiêng, Nhấn mạnh hơn <i>

1	<em>This text is emphasized</em>

Share This:

Tags:

Học tập HTML-CSS Tin học

• Prevoius
• Next