About the project XYZ

The structure of any page looks like:

<h1>Title</h1>
<div id="post">
<p>
 
  .... <!-- ============================================== -->
  .... <!-- put your content in here                       -->
  .... <!--                                                -->
  .... <!--                                                -->
  .... <!-- the content page has a max. width of 680 px !! -->
  .... <!-- ============================================== -->

</p>
</div>

Tipps

How to write text:
Text shall be included within <p> ... </p> tags. Use <b> ... </b>, <i> ... </i>, <u> ... </u> tags for bold, italic and underline, respectively.

How to include images:
<img src="template.png" style="margin: 20px 20px 0px 20px; float: right;"/> ... The values for the margins are top, right bottom, left.

Headings:
Use <h1> ... </h1> only at the top of the page; to structure the code use <h2> ... </h2> and <h3> ... </h3>, respectively.

Code:
Use <pre> ... </pre> to set code listings. <h2> ... </h2> and <h3> ... </h3>, respectively.

Links: A test link, a link to a PDF and a link to a ZIP ... the links with the icons are created as shown in the following example: 

<a href="..." id="pdf">PDF</a>

Currently the style sheet defines icons for: pdf, zip, windows, linux and mac IDs.

List Example


<span id="leftcol">
<ul>
<li>this is an unorderd list</li>
	<ul>
	<li>Sub-Unorderd list</li>
	<li>Sub-Unorderd list</li>
	</ul>
</ul>
</span>

<span id="rightcol">
<ol>
<li>this is an orderd list</li>
<li>orderd list ... second item</li>
	<ol>
	<li>Sub-Orderd list</li>
	</ol>
</ol>
</span>

  • this is an unorderd list
    • Sub-Unorderd list
    • Sub-Unorderd list
    • Sub-Unorderd list
  1. this is an orderd list
  2. orderd list ... second item
    1. Sub-Orderd list
    2. Sub-Orderd list






Tables

Tipp: Use tables only as a last resort. Generally it is better to rely on CSS for text placement. The following HTML code produces the table below.

<table border="1">
 <tr>
  <th>&nbsp;</th>
  <th>Item 1</th>
  <th>Item 2</th>
  <th>Item 3</th>
  <th>Item 4</th>
 </tr>
 <tr id="even">
   <td>Property 1</td>
   <td>1</td>
   <td>2</td>
   <td>3</td>
   <td>4</td>
 </tr>
 <tr id="odd"> 
   <td>Property 2</td>
   <td>1</td>
   <td>2</td>
   <td>3</td>
   <td>4</td>
 </tr>
 <tr id="even">
   <td>Property 3</td>
   <td>1</td>
   <td>2</td>
   <td>3</td>
   <td>4</td>
 </tr>
 <tr id="odd"> 
   <td>Property 4</td>
   <td>1</td>
   <td>2</td>
   <td>3</td>
   <td>4</td>
 </tr>
</table>
Item 1Item 2Item 3Item 4
Property 11234
Property 21234
Property 31234
Property 41234

Check the source-code of the following files: