HTML/XHTML in one page
                                                                                                                               
  Contents:
    Templates: Standarte template (simple HTML/XHTML document), Simple frame document, All doctypes;
    Main elements: Usual text, Comments, Links and Anchors, Images;
    Grouping elements: Block-level grouping, Inline grouping;
    Structured text: Usual text, Emphasis, Strong Emphasis, Citation, Abbreviation, Acronym, Code, Sample, Variable, Defining instance, User's text, Quotations, Subscript, Superscript, Document changes;
    Font style: monospaced text, italic text style, bold text style, "large" font, "small" font, underlined text, striked text;
    Structured document: Usual text, Preformatted Text, Breaks, Paragraph, Headings, Unordered list, Ordered list, Definition list, Table;
    Form's elements: Form's templates, Input, Text field, Password field, Checkbox, Radio, Submit button, Reset button, Hidden field, Image, File field, Select element, Text Area, Label;
    Other: Appendix "HTML/XHTML Character Entities", Appendix "URL Encoded Characters", Related References (Review, Documentation, etc.), Tools (Validators, etc.). 		 
                                                                                                                               
   Standarte template (simple HTML/XHTML document)  Simple frame document
  <html lang="en">

 <head>

  <meta charset="utf-8" />

  <title>... replace with your document's title ...</title>

  <meta name="description" content="... replace with your document's description ..." />
  <meta name="keywords" content="... replace with your document's keywords ..." />

  <link rel="stylesheet" type="text/css" href="... replace with your document's stylesheet location ..." />

  <style>
   ... CSS ...
  </style>

  <script>
   ... JavaScript ...
  </script>

 </head>


 <body>
  ... replace with your document's content ...
 </body>

</html> 		<html>

 <head>
  <title>A simple frameset document</title>
 </head>

 <frameset cols="20%, 80%">
  <frameset rows="100, 200">
   <frame src="contents_of_frame1.html" />
   <frame src="contents_of_frame2.gif" />
  </frameset>
  <frame src="contents_of_frame3.html" />
  <noframes>
   <p>This frameset document contains:</p>
   <ul>
    <li><a href="contents_of_frame1.html">Some neat contents</a></li>
    <li><img src="contents_of_frame2.gif" alt="A neat image" /></li>
    <li><a href="contents_of_frame3.html">Some other neat contents</a></li>
   </ul>
  </noframes>
 </frameset>

</html>
   Text  Preformatted Text: <pre> </pre> Form's templates 
  This is a text. This is a text. 
<pre>
voclass Node::Remove()
{
 if (prev)
 prev->next = next;
 else if (parent)
 parent->SetContent(null);
 if (next)
 next->prev = prev;
 parent = null;
}
</pre>	

voclass Node::Remove()
{
 if (prev)
 prev->next = next;
 else if (parent)
 parent->SetContent(null);
 if (next)
 next->prev = prev;
 parent = null;
}
<form action="... url of cgi script ... " method="get" name="" id="" >
...form contents...
</form>
   Comments: <!-- -->
  <!--This is a comments-->
   Links and anchors: <a href=" "> </a>
  This a link to <a href="http://www.cheat-sheets.org/" title="Cheat-sheets.org">Cheat-sheets.org</a>.
And this a link to <a href="http://www.cheat-sheets.org/" title="Cheat-sheets.org" target="_blank">Cheat-sheets.org</a> (opened in new page).
 This a link to Cheat-sheets.org.

And this a link to Cheat-sheets.org (opened in new page). 		<form action="... url of cgi script ... " method="put" enctype="multipart/form-data" name="" id="">
...form contents...
</form>
 
 
  <a href="#my-link">To my link</a>
<a name="my-link">My link</a> 		To my link
My link 		 Breaks: <br />
  First string.<br />Second string. First string.
Second string.		 Input: <input /> 
   Paragraph: <p> </p> <input type="text"
value="...text..."
size="32" maxlength="255"
name="" id="" />		  
  <a href="mailto:info@itlibitum.ru">Mail me</a> Mail me <p>This is the first paragraph</p>
<p>This is the second paragraph</p>

This is the first paragraph

This is the second paragrap
 
   Images: <img src=" " alt=" " />  Headings: <h1> </h1> <input type="password"
name="" id="" />		  
  <img src="logo.gif" width="" height="" alt="description" longdesc="long description" /> home page <h1>h1</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6</h6>

h1

h2

h3

h4

h5
h6
 
   Block-level grouping elements:
<div> </div>		 <input type="checkbox"
name="" value="" />First<br />
<input type="checkbox"
checked="checked"
name="" value="" />Second 		First 
Second
 
  <div class="" id=""><br />
element 1<br />
element 2<br />
element 2<br />
</div>

element 1
element 2
element 2
 
  <input type="radio"
name="" value="" />First<br />
<input type="radio"
checked="checked"
name="" value="" />Second 		First 
Second
 
   Inline grouping elements:
<span> </span>		  Unordered list: <ul><li> </li></ul>
  <ul>
 <li>first item</li>
 <li>second item</li>
 <li>third item</li>>
</ul>
  • first item
  • second item
  • third item
  <span class="" id="">e1</span><br />
<span class="" id="">e2</span><br />
<span class="" id="">e3</span> 		e1
e2
e3
 <input type="submit"
value="... submit ..." name="" id="" />		  
 
 
   Emphasis:
<em></em>; <strong></strong> 		 Ordered list: <ol><li> </li></ol> <input type="reset"
value="... reset ..." name="" id="" />		  
  <ol>
 <li>first item</li>
 <li>second item</li>
 <li>third item</li>>
</ol>
  1. first item
  2. second item
  3. third item
  <em>Emphasis.</em> Emphasis.
   <strong>Stronger
emphasis.</strong>		 Stronger emphasis <input type="button"
value="... button ..." name="" id="" />		  
 
   Citation:
<cite> </cite> <q> </q>		  Definition list:
<dl><dt> </dt> <dd> </dd></dl>
  <input type="hidden" value="... value ..." name="... name ..." id="" /> 
  As <cite>Harry S. Truman</cite> said: <q lang="en-us">The buck stops here</q>. As Harry S. Truman said: The buck stops here. <dl>
 <dt>first term</dt>
 <dd>definition</dd>
 <dt>second term</dt>
 <dd>definition</dd>
 <dt>third term</dt>
 <dd>definition</dd>
</dl>
first term
definition
second term
definition
third term
definition
  <input type="image"
src="logo.gif"
value="... value ..." name="" id="" />		  
 
   Abbreviation: <abbr></abbr>
  <abbr lang="en" title="World Wide Web">WWW</abbr> WWW
  <input type="file"
value="... file name ..." name="" id="" />		  
   Acronym: <acronym></acronym>  Table:
<table><tr><td></td></tr></table>
  <acronym lang="en" title="North Atlantic Treaty Organization">
NATO</acronym>		 NATO
  <table border="1" cellpadding="10" cellspacing="5" width="80%">
 <caption align="top">Example table</caption>
 <tr align="center">
  <th rowspan="2">Year</th>
  <th colspan="3">Sales</th>
  <!--2 cells-->
 </tr>
 <tr align="center">
  <!--1 cell-->
  <th valign="top">North</th>
  <th valign="middle">South</th>
  <th valign="bottom">Total</th>
 </tr>
 <tr align="center">
  <td align="left">2004</td>
  <td align="right">$10M</td>
  <td align="right">$8M</td>
  <td align="right">$18M</td>
 </tr>
 <tr align="center">
  <td align="left">2005</td>
  <td align="right">$14M</td>
  <td align="right">$11M</td>
  <td align="right">$25M</td>
 </tr>
 <tr align="center">
  <td align="left">2006</td>
  <td align="right">&nbsp;</td>
  <td align="right">&nbsp;</td>
  <td align="right">&nbsp;</td>
 </tr>
</table>
Example table
Year Sales
North South Total
2004 $10M $8M $18M
2005 $14M $11M $25M
2006      
Select: 
<select><option></option></select>
 
   Code: <code> </code> <select name="" id="">
 <option>element_1</option>
 <option>element_2</option>
 <option>element_3</option>
 <option>element_4</option>
 <option>element_5</option>
</select>
  <code>code</code> code
   Sample: <samp></samp>
  <samp>sample</samp> sample
   Variable: <var></var>
  <var>variable</var> variable
   Defining instance: <dfn></dfn> <select multiple="multiple" size="3" name="" id="">
 <option selected="selected">
element_1</option>
 <option selected="selected">
element_2</option>
 <option>element_3</option>
 <option>element_4</option>
 <option>element_5</option>
</select>
  <dfn>defining instance</dfn> defining instance
   Text entered the user: <kbd></kbd>
  <kbd>user's text</kbd> user's text
   Quotations:
<blockquote></blockquote>
 
  <blockquote cite="http://www.mycom.com/tolkien/twotowers.html"> They went in single file, running like hounds on a strong scent, and an eager light was in their eyes. Nearly due west the broad swath of the marching Orcs tramped its ugly slot; the sweet grass of Rohan had been bruised and blackened as they passed. </blockquote>
They went in single file, running like hounds on a strong scent, and an eager light was in their eyes. Nearly due west the broad swath of the marching Orcs tramped its ugly slot; the sweet grass of Rohan had been bruised and blackened as they passed.
 
  <select name="" id="">
 <option selected="selected"
label="none" value="none">
None</option>
 <optgroup label="Group 1">
  <option label="1.1" value="o_1.1">
Option 1.1</option>
  <option label="1.2" value="o_1.2">
Option 1.2</option>
  <option label="1.3" value="o_1.3">
Option 1.3</option>
 </optgroup>
 <optgroup label="Group 2">
  <option label="2.1" value="o_1.4">
Option 2.1</option>
  <option label="2.2" value="o_1.5">
Option 2.2</option>
 </optgroup>
 <optgroup label="Group 3">
  <option label="3.1" value="o_1.6">
Option 3.1</option>
  <option label="3.2" value="o_1.7">
Option 3.2</option>
 </optgroup>
</select>
 
 
 
 
 
   Subscript: <sub>/<sub>
  H<sub>2</sub>O H2O
   Superscript: <sup></sup>  Related References
  E=mc<sup>2</sup> E=mc2 Main pages:
W3C HTML Home Page  >>

Review:
Introduction to HTML 4 >>
Getting started with HTML  >>
More advanced HTML features  >>

Documentation:
HTML 4.01 Specification >>
    The global structure of an HTML document >>
    Text - Paragraphs, Lines, and Phrases >>
    Lists - Unordered, Ordered, and Definition Lists >>
    Tables >>
    Links - Hypertext and Media-Independent Links >>
    Objects, Images, and Applets >>
    Style Sheets - Adding style to HTML documents >>
    Alignment, font styles, and horizontal rules >>
    Frames - Multi-view presentation of documents >>
    Forms - User-input Forms: Text Fields, Buttons, Menus, and more >>
    Scripts - Animated Documents and Smart Forms >>
    Index of Elements >>
    Index of Attributes >>
XHTML™ 1.0 The Extensible HyperText Markup Language (Second Edition) >>
Code for the Representation of the Names of Languages. From ISO 639 >>
[RFC1738] URI - "Uniform Resource Locators" >>
[URI] "Uniform Resource Identifiers (URI): Generic Syntax" >>
[UNICODE] The Unicode Consortium. The Unicode Standard, Version 4.1.0 >>
[RFC2279] "UTF-8, a transformation format of ISO 10646" >>
   Document changes:
<ins></ins><del></del>
 
  A Sheriff can employ  <del>3</del> <ins datetime="" cite="" title="">5</ins> deputies. A Sheriff can employ 35 deputies.
 
  Font style: tt, i, b, big, small, strike, s, u
   <tt>monospaced text</tt> monospaced text
   <i>italic text style</i> italic text style
   <b>bold text style</b> bold text style
   <big>"large" font</big> "large" font
   <small>"small" font</small> "small" font Text area: <textarea></textarea> 
   Related themes <textarea name="" id=""
rows="6" cols="40">
First line of initial text.
Second line of initial text.
</textarea>
  CSS - Cascading Style Sheets (CSS.SU)
XML - eXtensible Markup Language (XML.SU)
DTD - DocType Declaration
 
 
 
  Label: <label></label> 
  <label for="id_text_area">First name</label>
 
  Tools  Miscellaneous 
  Validators:
  • W3C MarkUp Validator. - Also known as the HTML validator, it helps check Web documents in formats like HTML and XHTML, SVG or MathML >>
  • Checklink - Checks anchors (hyperlinks) in a HTML/XHTML document. Useful to find broken links, etc. >>
  • CSS Validator - validates CSS stylesheets or documents using CSS stylesheets. >>
  • RDF Validator >>
  • Feed Validator. - it helps check newsfeeds in formats like ATOM, RSS of various flavors. >>
  • P3P Validator - Checks whether a site is P3P enabled and controls protocol and syntax of Policy-Reference-File and Policy >>
  • XML Schema Validator >>
  • MUTAT - a human-centered testing tool (framework) >>
Public Domain 2006-2015 Alexander Krassotkin
Valid XHTML 1.0 Transitional   Valid CSS!