Examples and usage guidelines for form control styles, layout options, and custom components for creating a wide variety of forms.OverviewBootstrap’s form controls expand on our Rebooted form styles with classes. Use these classes to opt into their customized displays for a more consistent ...
<divclass="col-lg-8 col-lg-offset-2"style="padding-top: 40px"><formclass="form-horizontal"method="post"action=""id="classes-form"><divclass="box-body"><divclass="form-group"><labelfor="inputName"class="col-sm-2 col-sm-offset-1 control-label">班级名称</label><divclass="col-sm...
Additional rules for a horizontal form:Add class .form-horizontal to the <form> element Add class .control-label to all <label> elementsTip: Use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout....
"form-group"><labelclass="sr-only"for="email">Email 地址</label><inputtype="email"class="form-control"placeholder="Enter email"></div><divclass="form-group"><labelclass="sr-only"for="pass">密码</label><inputtype="password"class="form-control"placeholder="Password"></div></form></...
Here’s a quick example to demonstrate Bootstrap’s form styles. Keep reading for documentation on required classes, form layout, and more.Email address We'll never share your email with anyone else. Password Check me out Submit html <form> <div class="mb-3"> <label for="example...
y - for classes that set both *-top and *-bottom 内边距 p-1 // padding: .25rem!important; p-2 // padding: .5rem!important; p-3 // padding: 1rem!important; p-4 // padding: 1.5rem!important; p-5 // padding: 3rem!important; ...
这样做将改变 .form-group 的行为,使其表现为栅格系统中的行(row),因此就无需再额外添加 .row 了。 Email Password Remember me Sign in Copy <form class="form-horizontal"> <div class="form-group"> <label for="inputEmail3" class="col-sm-2 control-label">Email</label> <div class="...
<inputtype="text"class="form-control"id="usr"> </div> <divclass="form-group"> <labelfor="pwd">Password:</label> <inputtype="password"class="form-control"id="pwd"> </div> Try it Yourself » Bootstrap Textarea Comment: The following example contains a textarea: ...
These classes increase the left margin of a column by * columns. For example, .col-md-offset-4 moves .col-md-4 over four columns. .col-md-4 .col-md-4 .col-md-offset-4 .col-md-3 .col-md-offset-3 .col-md-3 .col-md-offset-3 .col-md-6 .col-md-offset-3 <div class="...
Heads up! Applying color modes to elements that aren’t the <html> or <body> elements requires classes like .text-body and .bg-body. This is because many HTML elements have no set color or background to style until you add them yourself. We’ve included them here for you just in ...