8.0: Forms Markup
<ol class="form"> <li> <label for="input">Input</label> <input name="input" id="input" {$modifiers} /> </li> <li> <label for="selectbox">Selectbox</label> <select id="selectbox" {$modifiers}> <option value="">Lorem ipsum</option> <option value="1">Dolor sit amet</option> <option value="2">Lorem ipsum</option> </select> </li> <li> <label for="textarea">Textarea</label> <textarea id="textarea" rows="5" cols="35" {$modifiers}></textarea> </li> </ol>
Disabled
disabled
8.1
8.1: Button Markup
<p> <button>Button</button> <input type="submit" value="Submit" /> <input type="reset" value="Reset" /> </p>
8.2
8.2: Checkboxes Markup
<ol class="form-inline"> <li> <input type="checkbox" id="checkbox-1"> <label for="checkbox-1">Lorem ipsum dolor sit amet</label> </li> <li> <input type="checkbox" id="checkbox-2"> <label for="checkbox-2">Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua lorem ipsum dolor sit amet</label> </li> <li> <input type="checkbox" id="checkbox-3"> <label for="checkbox-3">Ut enim ad minim veniam</label> </li> <li> <input type="checkbox" id="checkbox-4" disabled="disabled"> <label for="checkbox-4">Example of a disabled checkbox</label> </li> <li> <input type="checkbox" id="checkbox-5"> <label for="checkbox-5">Nisi ut aliquip</label> </li> </ol>
8.3
8.3: Radio Buttons Markup
<ol class="form-inline"> <li> <input type="radio" id="radio-1" name="radio"> <label for="radio-1">Lorem ipsum dolor sit amet</label> </li> <li> <input type="radio" id="radio-2" name="radio"> <label for="radio-2">Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua lorem ipsum dolor sit amet</label> </li> <li> <input type="radio" id="radio-3" name="radio"> <label for="radio-3">Ut enim ad minim veniam</label> </li> <li> <input type="radio" id="radio-4" name="radio" disabled="disabled"> <label for="radio-4">Example of a disabled radio button</label> </li> <li> <input type="radio" id="radio-5" name="radio"> <label for="radio-5">Nisi ut aliquip</label> </li> </ol>