62 lines
1.8 KiB
HTML
62 lines
1.8 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<title>Title</title>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<h1>Clean Webkit CSS3 UI</h1>
|
|||
|
|
|
|||
|
|
<section class="tabs">
|
|||
|
|
<input id="tab-1" type="radio" name="radio-set" class="tab-selector-1" checked="checked" />
|
|||
|
|
<label for="tab-1" class="tab-label-1">Elements</label>
|
|||
|
|
|
|||
|
|
<input id="tab-2" type="radio" name="radio-set" class="tab-selector-2" />
|
|||
|
|
<label for="tab-2" class="tab-label-2">Text Fields</label>
|
|||
|
|
|
|||
|
|
<input id="tab-3" type="radio" name="radio-set" class="tab-selector-3" />
|
|||
|
|
<label for="tab-3" class="tab-label-3">Details</label>
|
|||
|
|
|
|||
|
|
<div class="clear-shadow"></div>
|
|||
|
|
|
|||
|
|
<div class="content">
|
|||
|
|
<div class="content-1">
|
|||
|
|
|
|||
|
|
Slider (Range)
|
|||
|
|
<input type="range">
|
|||
|
|
Toggles (Checkboxes)
|
|||
|
|
<input type="checkbox" unchecked>
|
|||
|
|
<input type="checkbox" checked>
|
|||
|
|
Radio buttons<br />
|
|||
|
|
<input type="radio" name="choix">
|
|||
|
|
<input type="radio" name="choix" checked>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="content-2">
|
|||
|
|
Text Fields
|
|||
|
|
<input type="text" placeholder="Username" name="input_text">
|
|||
|
|
Password Fields
|
|||
|
|
<input type="password" placeholder="Password" name="password">
|
|||
|
|
|
|||
|
|
<input type="submit" value="Submit »">
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="content-3">
|
|||
|
|
<p><b>The Clean Webkit CSS3 UI inclued:</b></p>
|
|||
|
|
<p>Form Inputs
|
|||
|
|
<br/>- Range
|
|||
|
|
<br/>- Checkboxes
|
|||
|
|
<br/>- Radio buttons
|
|||
|
|
<br/>- Submit button
|
|||
|
|
<br/>- Text and password fields</p>
|
|||
|
|
<p>CSS3 Tabs with radio buttons
|
|||
|
|
<br/>Custom scrollbar</p>
|
|||
|
|
<br />
|
|||
|
|
<p>ericftremblay.com</p>
|
|||
|
|
<p>github.com/ericft</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</section>
|
|||
|
|
</body>
|
|||
|
|
</html>
|