Tuesday, September 26, 2006

Create a logo image with a transparent background

Image :

  1. Use GIMP or Paint.NET to create a GIF image (I can't get it to correctly work with any other image format).
  2. Create a new GIF image of the desired width and height
  3. Make the background layer... NOT visible
  4. Insert a new layer

CSS (Style Sheet) :

  • I had to manually set the width and height
  • For some reason, the cursor wasn't changing to URL "pointer", so I forced it
#company_logo {
 background-image: url(images/company_logo1.gif);
 background-repeat: no-repeat;
 width: 189pt;
 height: 76pt;
 cursor: pointer;
Html :
<a href="http://www.mycompany.com"><div id="#company_logo"></div></a>

No comments: