Red transparent PNG Button
The working code:
Author: Free CSS Menus: www.freecssmenus.co.uk
Description: This Red CSS button uses a PNG image for a change. Browser compatibility for .png files has become friendlier over the last few years. Pngs are great as the transparency effect works effortlessly. A gif can look blocky and clumsy when sat on top of another image where as a .png will retain the feathered edges and max colours as when you designed it in Photoshop etc. I have displayed the button on three different coloured backgrounds to show the versatility of the transparent effect in png mode.
Category: Button
Tested Browsers: AOL 9, Firefox 3.0.1, Opera 9.10, IE 7
Comments:
No comments have been submitted for this script!
Would you like to read comments on other CSS scripts?
More CSS related to this script:
Red Horizontal Tabbed Menu. This Horizontal tabbed menu shows the user three different states: Normal, Hover and Active/Selected. This menu is still only using one image and the sliding doors technique.
Free Dark Red Nav Menu. This red navigation menu was created using our FREE CSS NAVIGATION MENU CREATOR. Dont worry if this horizontal menu is not to your taste. There are many css designs on this website and you can also build your own with our free utility.
Red Green and Blue Menu. These three css menus use subtle shades of red, green and blue, just enough to add a touch of class to any website.
When you come to copy the code, only copy the css and xhtml that corresponds to the colour which you have decided to use.
Orange CSS Rollover Button. This orange css button has been refined to contain only one image. Other rollover buttons of this nature would normally contain two images. Here we use the: background-postion command to display the image in four different positions. Why four? Well the normal state (no hover)has both left and right edges which are needed so that the button can stretch with more text. Apon the hover state the button uses another two edges.
Red transparent PNG Button. This Red CSS button uses a PNG image for a change. Browser compatibility for .png files has become friendlier over the last few years. Pngs are great as the transparency effect works effortlessly. A gif can look blocky and clumsy when sat on top of another image where as a .png will retain the feathered edges and max colours as when you designed it in Photoshop etc. I have displayed the button on three different coloured backgrounds to show the versatility of the transparent effect in png mode.
Latest CSS:
•
Sleek Drop-down Menu
A great example of what css can be used to create. This free download from PSDGR ...
Added: Friday 13 Aug, 2010
•
Bright Yellow Vertical Menu
If your website is bright and sunny then add this vertical menu to give it a spl ...
Added: Tuesday 15 Jun, 2010
•
Transparent Vertical Menu
This vertical golf menu uses a simple PNG image to give some transparency so tha ...
Added: Saturday 17 Apr, 2010
•
css3 Border Radius
CSS Border radius achievable with CSS3.
I do love the idea of creating corner ...
Added: Tuesday 06 Apr, 2010
•
Animated navigation menu
Great animated vertical menu. Our first submission by one of our visitors. Top M ...
Added: Monday 15 Feb, 2010
Top Rated:
Css rollover uk map
Free rollover map of the Unite ...
4.2 / 5 - 44 Ratings
CSS World Map Rollover
I made the UK rollover map las ...
4.4 / 5 - 34 Ratings
Transparent Vertical M ...
This vertical golf menu uses a ...
5 / 5 - 11 Ratings
Free Tabbed Navigation ...
Tabbed navigation menus improv ...
4.4 / 5 - 9 Ratings
Image Rollover Solar S ...
This example of css uses one m ...
4.9 / 5 - 7 Ratings
CSS Tags:
Image Cyan Grey Hypertext Transparency Design Vertical Png Forms Style Sheets Photo Gallery Text-decoration Navigation Metal Purple Depth Website Template Rounded Gold Button Sliding Doors Block Css3 Css Solar System Alignment Green Pink Tutorials Font Color Hover Css Width Blog Templates Orange Yellow Cascading Border-radius Red Corner Z-index Watermark Positioning Rating Url Border List Menu Drop Down Animation Style Rollover Tabbed Menu 3d Float Text Texture Colour Opacity Light Background Display Blue Centering Chrome Expandable Flash Icon Horizontal Script Dark
