zoukankan      html  css  js  c++  java
  • 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>
    

     效果如下:

  • 相关阅读:
    XML 的学习笔记3
    XML 的学习笔记2
    XML 的学习笔记1
    Tomcat 学习笔记2
    Tomcat 学习笔记1
    sol
    sol
    0、安装Ionic2
    ionic2 目录
    6、Angular Route 路由
  • 原文地址:https://www.cnblogs.com/agile2011/p/4101883.html
Copyright © 2011-2022 走看看