60 lines
2.1 KiB
HTML
60 lines
2.1 KiB
HTML
|
<!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>
|