Tìm hiểu HTML và XHTML - Fedu

CHÀO MỪNG BẠN ĐẾN VỚI THƯ VIỆN HỌC TẬP & ĐÀO TẠO CƠ BẢN

Tìm hiểu HTML và XHTML

HTML5

Hướng dẫn HTML

Biểu mẫu HTML

Đồ họa HTML

Phương tiện ghi HTML

HTML APIs

Tài nguyên HTML

XHTML là HTML được viết bằng XML.

XHTML là gì?

  • XHTML là viết tắt của Extensive HyperText Markup Language
  • XHTML gần giống với HTML
  • XHTML có nhiều quy tắc hơn HTML
  • XHTML là HTML được định nghĩa là một ứng dụng XML
  • XHTML được hỗ trợ bởi tất cả các trình duyệt chính

Tại sao sử dụng XHTML?

Nhiều trang trên Internet chứa HTML “xấu”.

Mã HTML này hoạt động tốt trong hầu hết các trình duyệt (ngay cả khi nó không tuân theo các quy tắc HTML):

<html>
<head>
<title>This is bad HTML</title>

<body>
<h1>Bad HTML
<p>This is a paragraph
</body>

Thị trường ngày nay có nhiều công nghệ trình duyệt khác nhau. Một số trình duyệt chạy trên máy tính và một số trình duyệt chạy trên điện thoại di động hoặc các thiết bị khác. Các thiết bị nhỏ hơn thường thiếu các nguồn lực hoặc hiện đại để giải thích các dấu hiệu “xấu”.

XML là một ngôn ngữ đánh dấu nơi các tài liệu phải được đánh giá chính xác (được cho là “tốt”).

Bằng cách kết hợp sức mạnh của HTML và XML, XHTML đã được phát triển. XHTML được thiết kế lại dưới dạng XML.

Sự khác biệt quan trọng nhất từ HTML

Cấu trúc tài liệu

  • XHTML DOCTYPE là bắt buộc
  • Thuộc tính xmlns trong <html> là bắt buộc
  • Thẻ <html>, <head>, <title>, và <body> là bắt buộc

Phần tử XHTML

  • Các phần tử XHTML phải được lồng nhau hợp lý
  • Các phần tử XHTML phải luôn luôn có thẻ đóng
  • Các phần tử XHTML phải là chữ thường
  • Tài liệu XHTML phải có một phần tử gốc

Thuộc tính XHTML

  • Tên thuộc tính phải là chữ thường
  • Giá trị thuộc tính phải được trích dẫn
  • Không được giảm thiểu thuộc tính

Thẻ <!DOCTYPE ….>

Một tài liệu XHTML phải có một khai báo XHTML DOCTYPE.

Các phần tử <html>, <head>, <title>, và <body> cũng phải hiện diện, và thuộc tính xmlns trong <html> phải xác định xml namespace cho tài liệu.

Ví dụ này cho thấy một tài liệu XHTML với tối thiểu các thẻ được yêu cầu:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml”>

<head>
<title>Title of document</title>
</head>

<body>
some content
</body>

</html>

Phần tử XHTML lồng nhau đúng cách

Trong HTML, một số phần tử có thể được lồng vào nhau không đúng, như sau:

<b><i>This text is bold and italic</b></i>

Trong XHTML, tất cả các phần tử phải được lồng vào nhau như nhau:

<b><i>This text is bold and italic</i></b>

Phần tử XHTML luôn có thẻ đóng

Ví dụ cách dùng sai:

<p>This is a paragraph
<p>This is another paragraph

Ví dụ cách dùng đúng:

<p>This is a paragraph</p>
<p>This is another paragraph</p>

Phần tử rỗng cũng phải dùng thẻ đóng

Ví dụ cách dùng sai:

A break: <br>
A horizontal rule: <hr>
An image: <img src=”happy.gif” alt=”Happy face”>

Ví dụ cách dùng đúng:

A break: <br />
A horizontal rule: <hr />
An image: <img src=”happy.gif” alt=”Happy face” />

Các phần tử XHTML là chữ thường

Ví dụ cách dùng sai:

<BODY>
<P>This is a paragraph</P>
</BODY>

Ví dụ cách dùng đúng:

<body>
<p>This is a paragraph</p>
</body>

Tên thuộc tính XHTML là chữ thường

Ví dụ cách dùng sai:

<table WIDTH=”100%”>

Ví dụ cách dùng đúng:

<table width=”100%”>

Giá trị thuộc tính phải được trích dẫn

Ví dụ cách dùng sai:

<table width=100%>

Ví dụ cách dùng đúng:

<table width=”100%”>

Không được giảm thiểu thuộc tính

Ví dụ cách dùng sai:

<input type=”checkbox” name=”vehicle” value=”car” checked />

Ví dụ cách dùng đúng:

<input type=”checkbox” name=”vehicle” value=”car” checked=”checked” />

Ví dụ cách dùng sai:

<input type=”text” name=”lastname” disabled />

Ví dụ cách dùng đúng:

<input type=”text” name=”lastname” disabled=”disabled” />

Cách chuyển đổi từ HTML sang XHTML

  1. Thêm XHTML <! DOCTYPE> vào dòng đầu tiên của mỗi trang
  2. Thêm thuộc tính xmlns vào phần tử html của mỗi trang
  3. Thay đổi tất cả các tên phần tử thành chữ thường
  4. Đóng tất cả các phần tử rỗng
  5. Thay đổi tất cả các tên thuộc tính thành chữ thường
  6. Trích dẫn tất cả các giá trị thuộc tính

 

Tham khảo thêm 2 khóa học hữu ích do giảng viên quốc tế trường FPT Arena giảng dạy: