HTML Basics

XHTML is a combination of HTML and XML (EXtensible Markup Language)
For XHTML all tag names must be in lowercase, and all XHTML elements must be closed.
All XHTML documents must have a DOCTYPE declaration, and that the html, head, title, and body elements must be present.

<!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">

HTML Basic Document
<html>
<head>
<title>Document name goes here</title>
</head>


<body>
Visible text goes here...
</body>


</html>

Meta Tags
Meta elements are typically used to specify page description, keywords, author of the
document, last modified, and other metadata.
The <meta> tag always goes inside the head element.
The metadata can be used by browsers (how to display content or reload page), search
engines (keywords), or other web services.

Heading Elements
<h1>Largest Heading</h1>
<h2> . . . </h2>
<h3> . . . </h3>
<h4> . . . </h4>
<h5> . . . </h5>
<h6>Smallest Heading</h6>

Text Elements
<p>This is a paragraph</p>
<br /> (line break)
<hr /> (horizontal rule)
<pre>This text is preformatted</pre>

Logical Styles
<em>This text is emphasized</em>
<strong>This text is strong</strong>
<code>This is some computer code</code>
<b> Defines bold text
<big> Defines big text
<big> Defines big text
<em> Defines emphasized text
<i> Defines italic text
<small> Defines small text
<sub> Defines subscripted text
<sup> Defines superscripted text
<ins> Defines inserted text
<del> Defines deleted text

Physical Styles
<b>This text is bold</b>
<i>This text is italic</i>

Links, Anchors, and Image Elements
<a href="http://www.example.com/">This is a Link</a>
<a href="http://www.example.com/"><img src="image/flower.jpg" alt="Alternate
Text"></a>
<a href="mailto:webmaster@example.com">Send e-mail</a>

If you want the link to open up in a new window you need to include the ‘target’ tag.
It would look like this:
<a href="http://www.example.com/" target=”_blank”>This is a Link</a>

A named anchor:
<a name="tips">Useful Tips Section</a>
<a href="#tips">Jump to the Useful Tips Section</a>

Unordered list
<ul>
<li>First item</li>
<li>Next item</li>
</ul>

Ordered list
<ol>
<li>First item</li>
<li>Next item</li>
</ol>

Definition list
<dl>
<dt>First term</dt>
<dd>Definition</dd>
<dt>Next term</dt>
<dd>Definition</dd>
</dl>

Images
In HTML, images are defined with the <img> tag. The <img> tag is empty, which means that it contains attributes only and it has no closing tag. To display an image on a page, you need to use the src attribute. Src stands for “source”. The value of the src attribute is the path to the image you want to display on your page. The path tells html where the image is stored, for example inside the folder called images.

The syntax of defining an image:
<img src="images/flower1.jpg" width=”100” height=”100”/>

Tables
<table border="1">
<tr>
<th>Tableheader</th>
<th>Tableheader</th>
</tr>
<tr>
<td>sometext</td>
<td>sometext</td>
</tr>
</table>

Other Elements
<!-- This is a comment -->

Email

<a href="mailto:us@example.org">Email us</a>