CSS3 button maker is a simple and great online tool created by Chris Coyier from CSS Tricks. This tool allows you to generate a image-less button fully making use of CSS3. I am sure that some of you may don’t know what CSS3 is really about. CSS3 is a collection of modules that extend the previous CSS2 specification that we all know. CSS level 3 is currently under development. Read further about CSS3 here.
Button above was made fully with CSS3. The effects are clearly visible in latest versions of Firefox, Konqueror, Opera or Safari/Webkit. In older browers that don’t support these properties, the fallback is solid-color background, no shadows, and square corners which is not a big deal as everybody are moving to new browsers. To create such button for your use, visit CSS3 button maker now. Here is a preview of the super duper online tool.
Once you’ve customized the button, click on the button “View the CSS” to get the CSS code. Copy the code and go to Blogger > Design > Edit HTML and search for ]]></b:skin>. Paste the copied code immediately before ]]></b:skin> and click Save.
To use it in posts or anywhere in your template, simply add a class=’button” attribute in anchor tag. Here is a sample button and its code.
<a href="http://css-tricks.com/examples/ButtonMaker/">CSS3 Button Maker</a>
You are done.
One Reply to “Cool CSS3 button maker”