User:Yeti: Difference between revisions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
== CSS Buttons == | == CSS Buttons == | ||
As there are new microformats happening all the time I set about a CSS button that looks like the ''handmade'' versions. This is the result. | As there are new microformats happening all the time I set about making a CSS button that looks like the ''handmade'' versions. This is the result. | ||
The file with the CSS and the two images required (logo and background) can be downloaded from [http://thebeastlybeasts.co.uk/css/microformat_css.zip The Beastly Beasts]. | The file with the CSS and the two images required (logo and background) can be downloaded from [http://thebeastlybeasts.co.uk/css/microformat_css.zip The Beastly Beasts]. | ||
Extract the microformat directory and the files in it to /css so that you have: | Extract the microformat directory and the files in it to /css so that you have:<br /> | ||
/css/microformat/microformat.css | /css/microformat/microformat.css<br /> | ||
/css/microformat/background.png | /css/microformat/background.png<br /> | ||
/css/microformat/logo.png | /css/microformat/logo.png | ||
| Line 12: | Line 12: | ||
The XHTML to create a button is: | The XHTML to create a button is: | ||
<pre><tag class="microformat-button | <pre><tag class="microformat-button microformat-type"><span></span>microformat-type</tag></pre> | ||
For example, an hCard button with a link to the spec: | For example, an hCard button with a link to the spec: | ||
Latest revision as of 00:30, 11 September 2008
CSS Buttons
As there are new microformats happening all the time I set about making a CSS button that looks like the handmade versions. This is the result.
The file with the CSS and the two images required (logo and background) can be downloaded from The Beastly Beasts.
Extract the microformat directory and the files in it to /css so that you have:
/css/microformat/microformat.css
/css/microformat/background.png
/css/microformat/logo.png
If your paths are different a bit of editing is needed.
The XHTML to create a button is:
<tag class="microformat-button microformat-type"><span></span>microformat-type</tag>
For example, an hCard button with a link to the spec:
<a href="http://microformats.org/wiki/hcard" title="Microformat enabled" class="microformat-button hcard"><span></span>hcard</a>
I agree to release all my text and image contributions (past, present and future), into the public domain*. Please be aware that other contributors might not have done the same, so if you want to use pages with my contributions under public domain terms, please check past contributors' user pages.
"^ Creative Commons Public Domain License, the original at http://creativecommons.org/licenses/publicdomain/ or any later version published by Creative Commons; with either a waiver of rights, or an assertion that no rights attach to a particular work."