What exactly is the difference between the two.
Any detailed explanation/reference would be helpful.
From the AEM docs (http://wem.help.adobe.com/enterprise/en_US/10-0/wem/developing/the_basics.html)
In addition to the resource types (primarily defined by the sling:resourceType property) there is also the resource super type. This is generally indicated by the sling:resourceSuperType property. These super types are also considered when trying to find a script. The advantage of resource super types is that they may form a hierarchy of resources where the default resource type sling/servlet/default (used by the default servlets) is effectively the root.
Also - see the SLing docs. This is a good topic to start with:
sling:resourceType: Locate the resource to be used for rendering.
sling:resourceSuperType: Locate the resource to be inherited, allowing us to override some of the scripts.
You can see an example of sling:resourceType and sling:resourceSuperType in geometrixx too.
Thats how sling:resourceType ans sling:resourceSuperType relate to each other.