Label, Text, Number, Email, Password, Date, Time, URL, Phone, Textarea, Select, Date/Time, Combobox, Checkbox, Radio Button, Rangeslider
<label class="form-label">Label Example</label> <input class="form-text" type="text" placeholder="" /> <input class="form-number" type="number" placeholder="" /> <input class="form-email" type="email" placeholder="" /> <input class="form-password" type="password" placeholder="Password Input Example" /> <input class="form-date" type="date" placeholder="" /> <input class="form-time" type="time" placeholder="" /> <input class="form-url" type="url" placeholder="" /> <input class="form-tel" type="tel" placeholder="" /> <textarea class="form-textarea"></textarea> <select class="form-select cv-dropdown"> <option value="UK">UK</option> <option value="Germany">Germany</option> <option value="France">France</option> <option value="">USA</option> <option value="">Canada</option> </select> <input class="form-datetime" placeholder="" /> <select class="form-combobox" placeholder="Select size..."> <option>X-Small</option> <option>Small</option> <option>Medium</option> <option>Large</option> <option>X-Large</option> <option>2X-Large</option> </select> <fieldset class="form-fieldset"> <input class="form-checkbox" type="checkbox"> Checkbox </fieldset> <fieldset class="form-fieldset"> <input class="form-radiobutton" type="radio"> Radiobutton </fieldset> <div class="range-slider" data-min="1" data-max="100"> <input value="20" readonly /> <input value="70" readonly /> </div>
Error, Warning, Info & Success validation styles for form elements.
<div class="validation error"> <div class="tooltip-top tooltip-rounded tooltip-error" data-tooltip="Error Message Tooltip"> <input class="form-text" type="text" placeholder="Text Input Example" /> </div> </div>