关于bootstrap中的类名form-control

来源:3-4 表单控件(输入框input)

无所畏惧小小小

2016-11-05 15:02

bootstrap中通过类名form-control表单控件验证是如何使用的,怎么样才能看到效果?

写回答 关注

2回答

  • 秋风5LIFE
    2016-11-05 16:18:14
    已采纳

    不能代替  这里的form-control只是控制表单的样式,正则验证的问题还是要通过form表单调用submit事件解决,课程里面讲的通过通过添加类名达到的效果一般都是对页面样式的改变。

    秋风5LIF... 回复无所畏惧小小...

    恩恩 好的额

    2016-11-06 17:21:20

    共 2 条回复 >

  • 秋风5LIFE
    2016-11-05 15:23:33

    form-control 是将表单元素相对于外围元素100%显示  就是例如输入框的宽度啥的 

    <!doctype html>
    <html>
    <head>
    	<meta charset="utf-8">
    	<title>form</title>
    	<link rel="stylesheet" href="bs/css/bootstrap.min.css">
    </head>
    <body>
    	<div class="container">
    		<!-- form-control 设置宽度为100% -->
    			<form action="table.html" method="post" role="form">
    				<div class="form-group">
    					<label>用户名:</label>
    					<input type="text" class="form-control" placeholder="请输入用户名">
    				</div>
    				<div class="form-group">
    					<label>密码:</label>
    					<input type="password" class="form-control" placeholder="请输入密码">
    				</div>
    				<div class="form-group">
    					<label>文件:</label>
    					<input type="file">
    				</div>
    				<div class="form-group">
    					<label>兴趣:</label>
    					<input type="checkbox"value="篮球">篮球
    				</div>
    					<div class="form-group">
    					<label>性别:</label>
    					<input type="radio" name="sex"value="男">男
    					<input type="radio" name="sex"value="女">女
    
    				</div>
    
    				<div class="form-group">
    					<select class="form-control">
    						<option value="">--请选择--</option>
    						<option value="1">1</option>
    						<option value="2">2</option>
    
    
    					</select>
    				</div>
    
    				<div class=" form-group">
    					<textarea class="form-control">
    						dfgdfg
    					</textarea>
    				</div>
    				<input type="submit" class="btn btn-success" value="提交">
    				<input type="reset" class="btn btn-info" value="重置">
    			</form>
    	</div>
    </body>
    </html>


    qq_馒头_... 回复无所畏惧小小...

    不能,form-control只是控制样式的

    2017-08-10 16:36:38

    共 2 条回复 >

玩转Bootstrap(基础)

告诉你使用Bootstrap,并且能够独立定制出适合自己的Bootstrap

314544 学习 · 2275 问题

查看课程

相似问题