HTML and CSS —

Adding the html Element

After the DOCTYPE declaration, you'll want to begin building your document from its root element. I use the term root purposely because all documents create a document tree, something that we'll be exploring at length. Understanding the tree created by HTML documents plays an important role in being able to effectively style those documents using CSS.

The html element is considered the root element of any HTML document. Remember, the declaration isn't an HTML elementit's SGML. So the first element to appear takes on the important root status.

Example 1-2 shows the html element, with its opening tag and closing tag.

Example 1-2. The root HTML element
<html>

</html>

Pretty basic, right? Well, in XHTML, we have to add one other important piece to the opening tag, and that's the XML namespace for XHTML. This is just another way of identifying the language being used within the document. I won't go into the ideological reasons we do this, but suffice it to say that it must be there to validate (see Example 1-3).

Example 1-3. The root HTML element with the XML namespace attribute and value
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

</html>

You can see the xmlns attribute, which stands for "XML namespace" and the value is a URL, which, if you follow it, leads nowhere exciting, I promise! You'll just get a page saying you've reached the XML namespace for XHTML. Again, this is just another identifier.

NOTE

You'll notice a few other bits of syntax, including the xml:lang attribute, which defines the language of the document using XML syntax (remember, XHTML is a combo of HTML and XML), in this case en for English, and the lang attribute from HTML, declaring the same information. These are optional attributes, but we'll use them both, for full compatibility.