input元素的 class样式为“.form-control”,可以添加通过“.form-control-sm/lg”定义 form控件大小。 input元素中添加“readonly”属性,定义只读文本, 将“.form-control”替换为“.form-control-plaintext”去掉边框背景等样式 input type="checkbox"时,class="form-check-input",label class="form-check-label"...
<input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email"> </div> <div class="form-group"> <label class="sr-only" for="exampleInputPassword2">Password</label> <input type="password" class="form-control" id="exampleInputPassword2" placeholder="Password">...
通过为表单添加.form-horizontal,并使用Bootstrap预置的栅格class可以将label和控件组水平并排布局。这样做将改变.form-group的行为,使其表现为栅格系统中的行(row),因此就无需再使用.row了。 复制代码 代码如下: <form class="form-horizontal" role="form"> <div class="form-group"> <label for="inputEmail...
Note: Inputs will NOT be fully styled if their type is not properly declared!Name: Password: The following example contains two input elements; one of type text and one of type password:Example <div class="form-group"> <label for="usr">Name:</label> <input type="text" class="form...
<pclass="form-control-static">someone@example.com</p> </div> </div> </form> Try it Yourself » Bootstrap Input Groups The.input-groupclass is a container to enhance an input by adding an icon, text or a button in front or behind it as a "help text". ...
<form> <input class="form-control" id="focusedInput" value="Demonstrative focus state" type="text"> </form> </div> 1. 2. 3. 4. 5. 显示出阴影 然后还有只读,禁用状态 2.控制尺寸 通过.input-lg类似的类可以为控件设置高度,通过.col-lg-*类似的类可以为控件设置宽度。
通过将.form-check-inline添加到任何.form-check,将同一水平行上的复选框或单选框分组。 1 2 3 (disabled) <divclass="form-check form-check-inline"><inputclass="form-check-input"type="checkbox"id="inlineCheckbox1"value="option1"><labelclass="form-check-label"for="inlineCheckbox1">1</label>...
<form class="navbar-form pull-left"> <input type="text" class="span2"> <button type="submit" class="btn">Submit</button> </form> 搜索表单 在导航条内为form添加.navbar-search,并为输入框添加.search-query即可获得一个搜索表单。 <form class="navbar-search pull-left"> <input type="text...
复选框通过使用 class="form-check" 来确保标签和复选框有适当边距。 .form-check-label 类添加到标签元素,.form-check 容器内添加 .form-check-input 类来设置复选框的样式。checked 属性用于设置默认选中的选项。 单选框如果您希望用户从预设选项列表中选择一个选项,可以使用单选框:...
<input type="text" readonly class="form-control" id="startTime" uib-datepicker-popup="yyyy-MM-dd" ng-model="st" is-open="startTimeBox.opened" datepicker-options="dateOptions" ng-required="false" show-button-bar="false" close-text="Close"/> <span class="input-group-btn"> <button ty...