<form class="form-horizontal" role="form">
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-2 control-label">邮箱</label>
    <div class="col-sm-10">
      <input type="email" class="form-control" id="inputEmail3" placeholder="请输入您的邮箱地址"/>
    </div>
  </div>
  <div class="form-group">
    <label for="inputPassword3" class="col-sm-2 control-label">密码</label>
    <div class="col-sm-10">
      <input type="password" class="form-control" id="inputPassword3" placeholder="请输入您的邮箱密码"/>
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <div class="checkbox">
        <label><input type="checkbox"/>记住密码</label>
      </div>
    </div>
  </div>
  <div class="form-group">

    <div class="col-sm-offset-2 col-sm-10">
      <button type="submit" class="btn btn-default">进入邮箱</button>
    </div>
  </div>
</form>

bootstrap 水平表单的更多相关文章

  1. Bootstrap系列 -- 12. 水平表单

    Bootstrap框架默认的表单是垂直显示风格,但很多时候我们需要的水平表单风格(标签居左,表单控件居右) 在Bootstrap框架中要实现水平表单效果,必须满足以下两个条件: 1.在<form ...

  2. Bootstrap关于表单(二):水平表单

    Bootstrap框架默认的表单是垂直显示风格,但很多时候我们需要的水平表单风格(标签居左,表单控件居右) 在Bootstrap框架中要实现水平表单效果,必须满足以下两个条件: 1.在<form ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:水平表单

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. bootstrap学习笔记一 登录水平表单

    先上效果图: 样式定义: <form class="form-horizontal"> <div class="control-group"& ...

  5. Bootstrap CSS 表单

    表单布局 Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 垂直或基本表单 基本的表单结构是 Bootstrap 自带的,个别的表单控件自动接收一些全局样式.下面列 ...

  6. 一步一步学习Bootstrap系列--表单布局

    前言:Bootstrap 属于前端 ui 库,通过现成的ui组件能够迅速搭建前端页面,简直是我们后端开发的福音,通过几个项目的锻炼有必要总结些常用的知识,本篇把常用的Bootstrap表单布局进行归纳 ...

  7. 关于bootstrap--表单(水平表单)

    在Bootstrap框架中要实现水平表单效果,必须满足以下两个条件:1.在<form>元素是使用类名“form-horizontal”.2.配合Bootstrap框架的网格系统.(网格布局 ...

  8. bootstrap -- css -- 表单控件

    若干css样式 .form-control { display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14p ...

  9. bootstrap之表单

    一.表单布局 向父 <form> 元素添加 role="form". 把标签和控件放在一个带有 class .form-group 的 <div> 中.这是 ...

随机推荐

  1. iOS实现用控制器作为弹框效果(modalPresentationStyle)

    如图: 中间模块其实为一个正常vc控制器,一般我们present,都是采用默认style 但如果要实现这种,写法如下: navigationC.modalPresentationStyle = UIM ...

  2. Linux FHS

    学习linux有必要了解FHS的知识,FHS英文全称是Filesystem Hierarchy Standard.中文翻译就是文件系统层次结构标准.关于这个详细的介绍参考官方的文档和鸟哥linux书. ...

  3. Linux初学:(一)Linux概述

    Linux各个目录的结构介绍 Linux系统以目录的方式来组织和管理系统中的所有文件.Linux系统通过目录将系统中的所有的文件分级.分层组织在一起,形成了Linux文件系统的树形结构层次.以根目录“ ...

  4. 【转载】4412开发板嵌入式QtE应用开发环境搭建

    本文转自迅为iTOP-4412开发板实战教程书籍:http://topeetboard.com QtE应用需要使用开发工具qtcreator,本文介绍qtcreator-3.2.2的安装和使用.1. ...

  5. execve(file, argv, env)参数argv获取字符串个数

    /* Copyright (C) 1999, 2000, 2002, 2003 Free Software Foundation, Inc. This file is part of the GNU ...

  6. 运用PCA进行降维的好处

    运用PCA对高维数据进行降维,有一下几个特点: (1)数据从高维空间降到低维,因为求方差的缘故,相似的特征会被合并掉,因此数据会缩减,特征的个数会减小,这有利于防止过拟合现象的出现.但PCA并不是一种 ...

  7. POJ 1325 Machine Schedule——S.B.S.

    Machine Schedule Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 13731   Accepted: 5873 ...

  8. UVA - 10375 Choose and divide[唯一分解定理]

    UVA - 10375 Choose and divide Choose and divide Time Limit: 1000MS   Memory Limit: 65536K Total Subm ...

  9. 初识CDQ分治

    [BZOJ 1176:单点修改,查询子矩阵和]: 1176: [Balkan2007]Mokia Time Limit: 30 Sec  Memory Limit: 162 MBSubmit: 200 ...

  10. JSON.net 在实体类中自定义日期的格式

    定义日期格式转换类,其继承 IsoDateTimeConverter,代码如下: public class DateTimeConverter : IsoDateTimeConverter { pub ...