2.4.1 Giới thiệu
HTML (tiếng Anh, viết tắt cho "HyperText Markup Language", tức là "Ngôn ngữ Đánh dấu Siêu văn bản") là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang web, nghĩa là các mẩu thông tin được trình bày trên World Wide Web. Được định nghĩa như là một ứng dụng đơn giản của SGML, vốn được sử dụng trong các tổ chức cần đến các yêu cầu xuất bản phức tạp, HTML giờ đây đã trở thành một chuẩn Internet do tổ chức World Wide Web Consortium (W3C) duy trì. Phiên bản mới nhất của nó hiện là HTML 4.01. Sau đó, người ta đã thay thế nó bằng XHTML. Hiện nay, các nhà phát triển đang tập trung hoàn thiện phiên bản tiếp theo của HTML là HTML5
Bằng cách dùng HTML động hoặc Ajax, lập trình viên có thể được tạo ra và xử lý bởi số lượng lớn các công cụ, từ một chương trình soạn thảo văn bản đơn giản – có thể gõ vào ngay từ những dòng đầu tiên – cho đến những công cụ xuất
bản WYSIWYG phức tạp. HTML không phải là ngôn ngữ lập trình, nó là ngôn ngữ trình bày.
Có bốn loại phần tử đánh dấu trong HTML:
• Đánh dấu Có cấu trúc miêu tả mục đích của phần văn bản (ví
dụ, <h1>Golf</h1> sẽ điều khiển phần mềm đọc hiển thị "Golf" là đề mục cấp một),
• Đánh dấu trình bày miêu tả phần hiện hình trực quan của phần văn bản bất kể chức năng của nó là gì (ví dụ, <b>boldface</b> sẽ hiển thị đoạn văn bản boldface) (Chú ý là cách dùng đánh dấu trình bày này bây giờ không còn được khuyên dùng mà nó được thay thế bằng cách dùng CSS),
• Đánh dấu liên kết ngoài chứa phần liên kết từ trang này đến trang kia (ví dụ, <a href="http://www.wikipedia.org/">Wikipedia</a> sẽ hiển thị từ Wikipedia như là một liên kết ngoài đến một URL) cụ thể, và
• Các phần tử thành phần điều khiển giúp tạo ra các đối tượng (ví dụ, các nút và các danh sách).
Tách phần trình bày và nội dung
Nỗ lực tách phần nội dung ra khỏi phần hình thức trình bày của trang HTML đã đưa đến sự xuất hiện của các chuẩn mới như XHTML. Các chuẩn này nhấn mạnh vào việc sử dụng thẻ đánh dấu vào việc xác định cấu trúc tài liệu như phần đề mục, đoạn văn, khối văn bản trích dẫn và các bảng, chứ không khuyên dùng các thẻ đánh dấu mang tính chất trình bày trực quan, như<font>,<b>(in đậm), và<i> (in nghiêng). Những mã mang tính chất trình bày đó đã được loại bỏ khỏi HTML 4.01 Strict và các đặc tả XHTML nhằm tạo điều kiện cho CSS. CSS cung cấp một giải pháp giúp tách cấu trúc HTML ra khỏi phần trình bày của nội dung của nó.
Định nghĩa kiểu tài liệu (DTD)
Tất cả các trang HTML nên bắt đầu với một khai báo Định nghĩa kiểu tài liệu (hay DTD). Ví dụ:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2.4.2 Phần tử HTML.
Phần tử HTML hay còn được biết đến với tên Tag hay Entity hay thẻ. HTML là ngôn ngữ đánh dấu (markup-language) do đó có thể hiểu một phần tử HTML chính là một đoạn văn bản được đánh dấu để thể hiện theo một cách nào đó.
HTML có nhiều loại phần tử và mỗi phần tử HTML có một tên cũng như tác dụng khác nhau, có phần tử dùng để chỉ cả một tài liệu nhưng có phần tử chỉ sử dụng để mô tả một bức ảnh.
Cú Pháp
Một phần tử HTML luôn có thể được nhận ra bởi nó được bao quanh bởi cặp dấu<và>. Ví dụ:
<html> hay <a>
Mỗi phần tử luôn bao gồm một cặp thẻ đi song song, một thẻ mở và một thẻ đóng. Thẻ mở có dạng:
<tên_thẻ>
Còn thẻ đóng cũng tương tự nhưng có thêm dấu gạch chéo:
</tên_thẻ>
Các phần tử HTML có thể có các thuộc tính, thuộc tính của một phần tử có thể được biểu diễn ngay trong thẻ mở của phần tử. Ví dụ:
<p id="tagline"></p>
Các phần tử HTML có thể có hoặc không có nội dung, nếu có phần nội dung sẽ được đặt ở bên trong cặp thẻ mở và đóng. Ví dụ:
<p>đây là nội dung của thẻ "p"</p>
Có một số phần tử HTML không cần thẻ đóng, khi đó để đảm bảo tính hợp lệ của HTML, bạn nên đặt thêm một dấu gạch chéo ở cuối thẻ mở. Ví dụ:
<img src="test.jpg"/>
Bảng 2.5: Danh sách một số phần tử nổi bật của ngôn ngữ HTML
Tên phần tử Tác dụng
html Phần tử html là phần tử gốc (cha) của mọi phần tử nằm trong tài liệu HTML
head Phần tử head là phần tử chứa phần đầu của tài liệu HTML, tại đây sẽ chứa những mô tả, nội dung hoặc tham chiếu cần thiết cho tài liệu
body Phần tử body chứa phần thân của tài liệu HTML
p Phần tử p chứa một đoạn văn bản (p
b Phần tử b chứa một đoạn văn bản in đậm (b
i Phần tử i chứa một đoạn văn bản in nghiêng (i
a Phần tử a chứa một siêu liên kết tới một điểm trong tài liệu HTML hiện tại hoặc một tài liệu HTML khác (a
br Phần tử br sẽ ngắt dòng trên tài liệu HTML (br
img Phần tử img chứa bức hinh (img : image)
2.4.3 Cấu trúc cơ bản của HTML.
Một tài liệu HTML cơ bản cần có cấu trúc như sau:
<HTML> <HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <TITLE></TITLE> </HEAD> <BODY> <h1></h1> <p></p> <p></p> </BODY> </HTML>
Một cặp thẻ trong file html được nghĩa như sau:
<tên thẻ>Nội dung</tên thẻ>, ngoài ra cũng có một số thẻ được định nghĩa khác ví dụ như thẻ meta <meta nội dung thẻ />, <br />.
<tên thẻ> là dấu hiệu bắt đầu của một thẻ. </tên thẻ> là dấu hiệu kết thúc một thẻ. Trong cấu trúc trên có những cặp thẻ sau:
- <HTML></HTML>Là cặp thẻ được sử dụng để xác nhận đó là một file HTML.<meta http-equiv="Content-Type" content="text/html; charset=utf- <meta http-equiv="Content-Type" content="text/html; charset=utf- 8" />
Xác định file được định dạng theo chuẩn utf-8
- <HEAD></HEAD> Được dùng để xác định phần mở đầu cho file
- <TITLE></TITLE> Cặp thẻ này chỉ có thể sử dụng trong phần mở đầu của tài liệu, nó phải nằm trong thẻ HEAD, thể hiện tiêu đề của trang HTML này khi liệu, nó phải nằm trong thẻ HEAD, thể hiện tiêu đề của trang HTML này khi được chạy trên Internet hoặc Localhost.
- <BODY></BODY> Thẻ này được sử dụng để xác định phần nội dung chính của bài viết thể hiện trên file này bài viết thể hiện trên file này
- <h1></h1> Thẻ định dạng đề mục, thường người lập trình sẽ đặt tiêu đề bài viết vào cặp thẻ định dạng này. viết vào cặp thẻ định dạng này.
- <p></p> Được sử dụng để định dạng một đoạn văn bản.
- </BR> Là thể không có mở đầu và kết thúc thẻ, thẻ này xuất hiện ở đâu thì phần nội dung dưới đó sẻ sang dòng mới phần nội dung dưới đó sẻ sang dòng mới
- <B></B> Được sử dụng để định dạng một đoạn văn bản được in đậm.- <i></i> Được sử dụng để định dạng một đoạn văn bản được in nghiêng. - <i></i> Được sử dụng để định dạng một đoạn văn bản được in nghiêng. - <u></u> Được sử dụng để định dạng một đoạn văn bản được nghạch dưới. - <UL> Cặp thể kết hợp dùng để định dạng danh sách thông thường:
- <li> </li> Mục thứ nhất Cặp thể kết hợp dùng để định dạng danh sách thông thường: thông thường:
- <li></li> Mục thứ hai Cặp thể kết hợp dùng để định dạng danh sách thông thường. thường.
- </UL>Cặp thể kết hợp dùng để định dạng danh sách thông thường: