HTML - XHTML


XHTML is HTML written in XML format.

What is XHTML?

  • XHTML refers to Extensible Hypertext Markup Language

  • ##XHTML and HTML 4.01 is almost the same

  • XHTML is a stricter and purer version of HTML

  • XHTML is HTML defined in an XML application

  • XHTML is a W3C recommended standard released in January 2001

  • XHTML is supported by all major browsers

Why use XHTML?

Many pages on the Internet contain "bad" HTML.

If viewed in a browser, the following HTML code runs perfectly fine (even though it does not follow the HTML rules): 

<html>
<head>
<title>This is bad HTML</title>
<body>
<h1>Bad HTML
<p>This is a paragraph
</body>
XML is a document that must be properly marked up and well-formed markup language.
If you want to learn XML, read our XML tutorial.

There are a number of different browser technologies in today’s tech world. Some of them run on computers, while others may run on mobile phones or other small devices. Small devices often lack the resources and capabilities to interpret "bad" markup languages.

So - XHTML was developed by combining the best of XML and HTML. XHTML is HTML redesigned as XML.

The most important difference compared to HTML:

Document structure

  • XHTML DOCTYPE is

    mandatory The XML namespace attribute in

  • <html> is

    mandatory

    • ##<html>, < head>, <title> and <body> are also
  • mandatory

    • Element syntax

    XHTML elements Must
  • be properly nested

    • XHTML elements must always be
  • closed

    • Lowercase

  • The XHTML document must have
    • a root element

  • Attribute syntax

XHTML attributes must be
    lowercase

  • XHTML attribute values ​​must be surrounded by
    • quotes

  • XHTML attribute minimization is also
    • prohibited

  • ##<!DOCTYPE ....> is mandatory
XHTML documents must carry XHTML DOCTYPE declaration.

You can find the complete XHTML document type in W3School's Tag Reference Manual. The

<html>, <head>, <title>, and <body> elements must also be present, and the xml namespace must be specified for the document using the xmlns attribute in <html>.

The following example shows an XHTML document with the minimum required tags: 

<!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>
...... 
</body>
</html>

XHTML elements must be nested reasonably

In HTML, some elements do not need to be nested in each other, like this:

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

In XHTML, all elements must be properly nested within each other, like this:

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

##XHTML elements must have a closing tag

Incorrect example: 

<p>This is a paragraph
<p>This is another paragraph
Correct example: 

<p>This is a paragraph</p>
<p>This is another paragraph</p>
##Empty element Must contain closing tag

Incorrect example: 

A break: <br>
A horizontal rule: <hr>
An image: <img src="../style/images/happy.gif" alt="Happy face">
Correct example: 
A break: <br />
A horizontal rule: <hr />
An image: <img src="../style/images/happy.gif" alt="Happy face" />
XHTML elements must be lowercase

Incorrect example: 

<BODY>
<P>This is a paragraph</P>
</BODY>
Correct example: 
<body>
<p>This is a paragraph</p>
</body>
Attribute names must be lowercase

Incorrect example:

<table WIDTH="100%">
Correct example:

<table width="100%">
Attribute values ​​must have quotes

Wrong example: 

<table width=100%>
Correct example: 
<table width="100%">
Attribute abbreviation not allowed

Incorrect example:

<input checked>
<input readonly>
<input disabled>
<option selected>
Correct example:

<input checked="checked">
<input readonly="readonly">
<input disabled="disabled">
<option selected="selected">
How to convert HTML to XHTML

    Add an XHTML <!DOCTYPE> to your web page中

    2. Add the xmlns attribute to the html element of each page.

    3. Change all elements to lowercase

    4. Close all empty elements

    5. Change all Attribute names are lowercase

    6. Add quotes to all attribute values

Use the W3C validator to test your XHTML

←