Bootstrap关于表单(一)

1。基础表单

表单中常见的元素主要包括:文本输入框下拉选择框、单选按钮、复选按钮文本域按钮等。

在Bootstrap框架中,通过定制了一个类名`form-control`,也就是说,如果这几个元素使用了类名“form-control”,将会实现一些设计上的定制效果。

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
	<title>基础表单</title>
	<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>
<body>
<form role="form">
  <div class="form-group">
    <label for="exampleInputEmail1">邮箱:</label>
    <input type="email" class="form-control" id="exampleInputEmail1" placeholder="请输入您的邮箱地址">
  </div>
  <div class="form-group">
    <label for="exampleInputPassword1">密码</label>
    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="请输入您的邮箱密码">
  </div>
  <div class="checkbox">
    <label>
      <input type="checkbox"> 记住密码
    </label>
  </div>
  <button type="submit" class="btn btn-default">进入邮箱</button>
</form>	
</body>
</html>

 效果如下:

原文地址:https://www.cnblogs.com/agile2011/p/4101883.html