Press access key 6 for more information about navigating this site.Skip navigation and move to main content.|
Imageless buttons
These buttons are created, using pure CSS. No images are involved, just CSS and the code is flexible so that it is easy to use.
You'll notice that 2 classes are used for each button, class="css-button2 CSSNAME". The css-button2 class is a generic class that sets the size and borders of the button. CSSNAME is the name of the logo being used for the button. This class is required to set the background color and provide any overrides to the default styles.
You have to see the button as having two sides: a left and a right side. The left side is the "logo" part while the right side is the part containing the text next to the logo. It's possible to change the right hand section of the button, by using an addition style. For the fifth W3C button, the fonts were changed on the left and the background and text color was changed in the right side of the button. The class attribute of the button now has three classes.
There are two kinds of buttons: a button that links somewhere and one without a link (a banner).
The code for a button with a link, looks like this:
<li><a class="css-button CSSNAME" href="URL"><span>NAME</span> TEXT</a></li>
The code for a button that can serve as a banner, looks like this:
<li><span class="css-button CSSNAME"><span>NAME</span>
TEXT</span></li>
The guy who came up with this is Mike Golding. You can see more examples, source code, stylesheets and an in depth explanation at notestips.com
Some more scribbles for you to look at.
More Pages
Links to other parts of the site.
Friends
People who have been good enough to me that I would call them friends.
You can get your W3C stuff at the W3C site
It's has all the specifications you need, some tutorials and also validation tools. If you get into CSS you'll be needing this link !
Unless otherwise expressly stated, all original material of whatever nature created by Dzinelabs and included in this site and any related pages, including the weblog's archives, is licensed under The Creative Commons License.
