XHTML is an extension of HTML designed to work with XML user agents. The current version is XHTML 1.1. HTML is a standard language for publishing on the World Wide Web. HTML is an application of SGML (Standard Generalized Markup Language). SGML is the de facto standard for describing markup languages particularly those used in electronic format but not necessarily for the internet. SGML is both rich and complex. HTML on the other hand specifies only a small set of structural and semantic tags. HTML has support for hypertext and multimedia. The first line of an XHTML document must start with an xml declaration.
<?xml version = "1.0" encoding = "utf-8" ?>
Document Type Definition (DTD) is a collection of XML markup definitions that defines the legal structure of the language. There are three variations of the DTDs for XHTML - strict, transitional, and frameset. An XHTML document must conform to one of them and should be the first thing that has to be declared.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
The root element of an XHTML document must be html and the XHTML namespace has to be declared:
<html xmlns="http://www.w3.org/1999/xhtml">
Use the <p> tag to delineate paragraphs. For pre-formatted text use <pre> instead. The pre element tells browsers that the enclosed text is pre-formatted. The browser may then leave white space intact, render text with fixed pitch font, and disable automatic word wrap.
Header are of the form hn where n runs from 1 through 6. These are the different types of headers:
A link could take the viewer to a resource on the same
computer or on a different computer. The syntax for the
link is:
<a href = "path/to/file"> ... </a>
The path could be an absolute path like an url or a relative
path. Here are some of my favorite links:
An internal link would take the viewer to a different part of the same document. For example this internal link will take me to the section on forms. Note the use of tags.
This will bring up an e-mail form in case you want to send me mail. My e-mail address is mitra@cs.utexas.edu
Use the <img> element to include graphics. The height and width attributes are given in pixels. Here is a picture of a galaxy NGC 1300 taken by the Hubble Space Telescope.
Line breaks are introduced with < br />. We have purposely
broken the line.
Now we will introduce a horizontal line with the <hr /> element.
Here is a list of special characters in XHTML. You can write these characters in two ways - either using the English mnemonic or the hexadecimal code. For example the ampersand symbol can be written as: & or &
A table has a border, caption, head, foot, and body. The body is made out of cells spanning rows and columns. Here is a simple table:
Type | Population |
---|---|
Total | 17470 |
Black Rhino | 3610 |
White Rhino | 11100 |
Indian Rhino | 2400 |
Javan Rhino | 60 |
Sumatran Rhino | 300 |
Here is an example of a more complex table
1 | 2 | |
3 | 4 |
A form has the following components:
A form must also specify the method by which the data is transported - GET or POST. Also the script on the server side that will process the form data. To neatly align and present the form elements use borderless nested tables. Here is an example of a simple survey form.
The meta element allows search engine to know what is in the web page without having to go through every line. This element has two attributes: name and content. The name attribute can have two values keywords or description. The meta element is placed in the head section of the page.
<meta name = "keywords" content = "XHTML, Paragraphs, Headers, Lists, Tables, Forms" />
<meta name = "description" content = "This page gives a brief introduction to the XHTML syntax." />
The use of frames is being discouraged. I have included a discussion of frames for the sake of completeness. You can achieve the same effect of frames using Cascading Style Sheets. If you have to use frames use inline frames.