@tower1229/flow-ui
Version:
Highly customizable UI framework based Seajs/jQuery
120 lines (119 loc) • 6.68 kB
HTML
<div class="p">
<div class="row">
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">基本表单</div>
</div>
<div class="card-body">
<form class="form" id="form1">
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" name="name" placeholder="Enter your name" datatype="s4-16">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" name="password" placeholder="Password" datatype="s4-16">
</div>
<div class="form-group row">
<div class="span-4">
<label for="month">Month</label>
<select name="month" class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>
</div>
<div class="span-4">
<label for="year">Year</label>
<select name="year" class="form-control">
<option>2014</option>
<option>2015</option>
<option>2016</option>
<option>2017</option>
<option>2018</option>
<option>2019</option>
</select>
</div>
<div class="span-4">
<label for="cvv">CVV/CVC</label>
<input type="text" class="form-control" name="cvv" placeholder="123">
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Sign in</button>
<button type="reset" class="btn btn-warning">Reset</button>
</div>
</form>
</div>
</div>
</div>
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">基本表单</div>
</div>
<div class="card-body">
<form class="form" id="form2">
<div class="form-group row">
<label for="email" class="span-2 control-label">Email</label>
<div class="span-10">
<input type="email" class="form-control" name="email" placeholder="Email" datatype="e">
<div class="help-block">Example block-level help text here.</div>
</div>
</div>
<div class="form-group row">
<label for="password" class="span-2 control-label">Password</label>
<div class="span-10">
<input type="password" class="form-control" name="password" placeholder="Password" datatype="s4-16">
</div>
</div>
<div class="form-group row">
<div class="span-2 control-label">Checkbox</div>
<div class="span-10">
<label class="checkbox">
<input type="checkbox" name="checkbox1" value=""> Option two is disabled
</label>
<label class="checkbox">
<input type="checkbox" name="checkbox1" value=""> Option two is disabled
</label>
<label class="checkbox disabled">
<input type="checkbox" name="checkbox1" value="" disabled> Option two is disabled
</label>
</div>
</div>
<div class="form-group row">
<div class="span-2 control-label">Radio</div>
<div class="span-10">
<label class="radio">
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked=""> Option one is this and that—be sure to include why it's great
</label>
<label class="radio">
<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"> Option two can be something else and selecting it will deselect option one
</label>
<label class="radio disabled">
<input type="radio" name="optionsRadios" id="optionsRadios3" value="option3" disabled=""> Option three is disabled
</label>
</div>
</div>
<div class="form-group">
<div class="pull-right-2 span-10">
<button type="submit" class="btn btn-primary">Sign in</button>
<button type="reset" class="btn btn-warning">Reset</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>