How to show image from static resource in Visualforce pages

Example
apex:image id="theImage" value="/img/myimage.gif" width="220" height="55"/>

The example above renders the following HTML:
img id="theImage" src="/img/myimage.gif" width="220" height="55">

Resource Example

The example above renders the following HTML:
img id="theImage" src="/myResourceImage" width="200" height="200">

Zip Resource Example
apex:image url="{!URLFOR($Resource.TestZip, 'images/Bluehills.jpg')}" width="50" height="50" />

The example above renders the following HTML:
id="theImage" src="[generatedId]/images/Bluehills.jpg" width="50" height="50"/>

Sample Calculator using Salesforce Site

Salesforce Site Example..