<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Blueprint Buttons Sample Page</title> <!-- Framework CSS --> <link rel="stylesheet" href="../stylesheets/screen.css" type="text/css" media="screen, projection"> <link rel="stylesheet" href="../stylesheets/print.css" type="text/css" media="print"> <!--[if IE]><link rel="stylesheet" href="../stylesheets/ie.css" type="text/css" media="screen, projection"><![endif]--> <link rel="stylesheet" href="../stylesheets/buttons.css" type="text/css" media="screen, projection"> </head> <body> <div class="container"> <h1>A Button Example Page</h1> <hr> <h2 class="alt">This sample page demonstrates what you can do with the Buttons plugin.</h2> <hr> <div class="span-12"> <h3>Link Buttons</h3> <a class="button">Link Button</a> <a class="button positive">Positive Button</a> <a class="button negative">Negative Button</a> </div> <div class="span-12 last"> <h3>Real Buttons</h3> <button>Normal Button</button> <button class="positive">Positive Button</button> <button class="negative">Negative Button</button> </div> <div class="span-12"> <h3>Link Buttons with Images</h3> <a class="button"><img src="../images/buttons/tick.png" alt=""/> Save</a> <a class="button positive"><img src="../images/buttons/key.png" alt=""/> Change Password</a> <a class="button negative"><img src="../images/buttons/cross.png" alt=""/> Cancel</a> </div> <div class="span-12 last"> <h3>Real Buttons with Images</h3> <button><img src="../images/buttons/tick.png" alt=""/> Save</button> <button class="positive"><img src="../images/buttons/key.png" alt=""/> Change Password</button> <button class="negative"><img src="../images/buttons/cross.png" alt=""/> Cancel</button> </div> <div class="span-24"> <p><a href="http://validator.w3.org/check?uri=referer"> <img src="valid.png" alt="Valid HTML 4.01 Strict" height="31" width="88" class="top"></a></p> </div> </div> </body> </html>