Cơ bản về ngôn ngữ lâp trình HTML [Archive]

View Full Version : Cơ bản về ngôn ngữ lâp trình HTML

ongtrumrapchat

09-04-2008, 06:28 AM

Bài 1: Sơ lược về ngôn ngữ định dạng HTML

Post by: ongtrumrapchat
Trong bài này chúng ta sẽ đi tìm hiểu sơ lược về ngôn ngữ định dạng HTML, HTML là gì? ví dụ về một trang HTML đơn giản, Các trình soản thảo HTML.

1. Đôi điều cần biết về ngôn ngữ HTML
HTML là từ viết tắt của Hyper Text Markup Language (Ngôn ngữ định dạng siêu văn bản).
Một file .html bao gồm chứa các thẻ (tag) định dạng HTML.
Các thẻ HTML sẽ quy định cách hiển thị trên trình duyệt.
File định dạng HTML phải được ghi lại với phần mở rộng là .html hoặc .htm
Để soạn thảo một file HTML chúng ta có thể dùng bất kỳ một trình soạn thảo đơn giản nào (notepad, pspad, word,...).2. Một tài liệu HTML đơn giản.

Để bạn dễ hình dung, bạn hãy copy đoạn mã dưới đây vào một trình soạn thảo nào đó mà có sẵn trên máy của bạn(notepad, MS word,...).

<html>
<head>
<title>Tiều đều của tài liệu</title>
</head>
<body>
<p> Dưới đây là nội dung <b>của bạn</b></p>
</body>
</html>
Ghi lại file vừa soạn thảo vào ổ C: với tên test.html hoặc test.htm. Để mở file này bạn sẽ chạy trình duyệt Internet Explorer (IE) hoặc Firefox. Từ menu File chọn Open file... và trỏ tới file mà bạn mới ghi lại.

Sau khi ghi lại bạn có thể click đúp vào file vừa ghi, Windows sẽ tự động chạy chương trình thích hợp để mở file.:168:

3. Giải thích phần định dạng.

Ý nghĩa của một số thẻ trong đoạn mã HTML trên như sau:
Thẻ <html>...</html> chỉ ra rằng đây là tại liệu có định dạng HTML
<head>...</head> sẽ chứa một số thông tin của trang (tiêu đề, các đường link tới một số file khác.) mà nó không được hiển thị trong cửa số trình duyệt.
<body>...</body> Phần này sẽ chứa toàn bộ nội dung của trang và nó sẽ được hiển thị trên cửa số trình duyệt.4. .html hay .htm

Bạn có thể ghi file HTML theo một trong hai phần mở rộng là .html hoặc .htm, cả hai phần mở rộng trên đều được hỗ trợ bởi các trình duyệt như IE, Firefox, Opera,...
5. Một số trình soạn thảo mã HTML.

Ngoài một số trình soạn thảo HTML mang tính thương mại như (fontpage, dreamwraver, Edit plus,...), thì cũng có không ít những trình soạn thảo mã HTML Open source miễn phí tốt không kém. Dưới đây là một số trình soạn thảo bạn có thể tải miễn phí để dùng.
:168: Còn tiếp =>>

ongtrumrapchat

09-04-2008, 06:30 AM

Bài 2: Các phần tử trong ngôn ngữ HTML

Trong bài 2 này chúng ta sẽ tìm hiểu các phần tử (element) trong ngôn ngữ siêu định dạng văn bản HTML. Qua đó chúng ta cần nắm rõ nguyên lí và cấu trúc của các phần tử HTML.
Trước tiên bạn cần hiểu hai khái niệm dưới đây:
-Tài liệu HTML thực chất là một file văn bản chứa các định dạng HTML.
-Các phần tử HTML được tạo nên bởi các thẻ HTML.
1. Sơ lược về thẻ HTML

Thẻ HTML dùng để tạo lên các phần tử HTML.
Các phần tử HTML được bao bởi hai dấu (mở) < và dấu (đóng) &rt;.
Thẻ đầu tiên được gọi là thẻ đóng, và thẻ thứ hai được gọi là thẻ mở.
Nội dung hiển thị sẽ được chứa ở giữa thẻ đóng và thẻ mở.
Các thẻ HTML không phân biệt chữ hoa và chữ thường, bạn có thể viết <b> hay <B> là giống nhau.2. Các phần tử HTML

Bạn hãy nhớ lại ví dụ trong bài trước:

<html>
<head>
<title>Đây là tiêu đề của trang</title>
</head>
<body>
Đây là trang chủ<b>chữ đậm</b>
</body>
</html>

<html> <head> <title>Đây là tiêu đề của trang</title> </head> <body> Đây là trang chủ<b>chữ đậm</b> </body></html>Trong đó <b>chữ đậm</b> là một phần tử HTML. Như vậy chúng ta thấy một phần tử HTML có các đặc điểm sau:
Một phần tử HTML được cấu thành bởi hai thẻ, một thẻ mở và một thẻ đóng.(<b> thẻ mở và </b> là thẻ đóng)
Một phần tử HTML bao giờ cũng mang một ý nghĩa nhất định. Ví dụ như phần tử <b> sẽ hiển thị chữ đậm hay phần tử <body>...</body> sẽ bao chứa nội dung của toàn bộ trang,...
:168: Còn nữa =>

ongtrumrapchat

09-04-2008, 06:34 AM

Bài 3: Các thẻ cơ bản trong HTML

Hầu hết các thẻ quan trọng trong HTML là các thẻ định nghĩa tiêu đề, nội dung và xuống hàng.
Cách tốt nhất để bạn có thể học nhanh ngôn ngữ HTML đó là học thông qua ví dụ, bạn hãy chọn cho mình một trình soạn thảo HTML ưng ý, nó có thể cho phép bạn viết mã HTML một cách tiện lợi và có thể xem trước những gì bạn đang làm.
Sau đây là một số thẻ cơ bản của ngôn ngữ HTML
1. Các thẻ tiêu đề (Headings)

Các thẻ tiêu đề (headings) được định nghĩa từ h1 cho tới h6. Các thẻ này dùng để định nghĩa mức độ quan trọng của các dòng tiêu đề và sự khác nhau về độ lớn của chữ.

<h1>Thẻ H1</h1>
<h2>Thẻ H2</h2>
<h3>Thẻ H3</h3>
<h4>Thẻ H4</h4>
<h5>Thẻ H5</h5>
<h6>Thẻ H6</h6>
[QUOTE]
Sau mỗi dòng tiêu đề HTML sẽ tự động thêm mới dòng trắng vào trước và sau của dòng tiêu đề.
2. Paragraps

Đoạn văn bản được định nghĩa bởi thẻ <p>.

[QUOTE]<p>Nội dung đoạn văn bản.</p>

Tương tự như dòng tiêu đề HTML cũng tự động thêm dòng trắng trước và sau đoạn văn bản
3. Thẻ xuống dòng <br>

Thẻ xuống dòng được sử dụng khi bạn muốn kết thúc một dòng nhưng không muốn bắt đầu một đoạn văn bản. Khi đó chúng ta sử dụng thẻ <br>
<p>Nội dung đoạn văn <br> bắt đầu một dòng mới</p>

Thẻ <br> là một thẻ rỗng do đó nó không có thẻ đóng.
4. Chú thích trong HTML

Chú thích trong HTML dùng để diễn giải hoặc chú thích cho một thẻ HTML hoặc một đoạn mã HTML nào đó. Khi trình duyệt đọc đến dòng chú thích nó sẽ bỏ qua và không hiển thị lên trên trình duyệt. Đoạn chú thích được viết với cấu trúc nhau sau:
5. Các số thẻ HTML cơ bản khác.

<HTML> :Định nghĩa một tài liệu HTML.
<body> :Định nghĩa nội dung một văn bản HTML.
<p> :Định nghĩa một đoạn văn bản.
<br> :Xuống một dòng
<hr> :Định nghĩa một đường kẽ ngang.
 :Định nghĩa dòng chú thích trong HTML.:168: Còn nữa =>>>

ongtrumrapchat

09-04-2008, 06:37 AM

Bài 4: Các thẻ định dạng văn bản trong HTML.

Trong HTML có khá nhiều thẻ định dạng văn bản, các thẻ này dùng để định dạng văn bản và xuất ra màn hình ví dụ như chữ đậm, nghiêng, gạch chân,...
1. Các thẻ định dạng văn bản

ThẻMô tả<b>Định dạng chữ đậm
<i>Chữ in nghiêng
<em>Định nghĩa một đoạn cần nhấn mạnh.
<small>Chữ nhỏ
<big>Định nghĩa chữ lớn
<strong>Định nghĩa chữ khỏe(đậm) giống như <b>
<sub>Định nghĩa chỉ số trên.
<sup>Định nghĩa chỉ số dưới
.<ins>Định nghĩa dòng chèn thêm vào đoạn văn bản.
<Del>Định nghĩa dòng chữ đã xóa (không còn ý nghĩa) trong đoạn văn bản.