bootstrap+font-awesome表单

<form action="" class="form-horizontal col-sm-offset-4">
    <div class="input-group form-group col-sm-4 ">
        <span class="input-group-addon"><i class="fa fa-user fa-fw"></i></span>
        <input class="form-control" type="text" placeholder="Username">
    </div>

    <div class="input-group form-group margin-bottom-sm col-sm-4 ">
        <span class="input-group-addon"><i class="fa fa-envelope-o fa-fw"></i></span>
        <input class="form-control" type="text" placeholder="Email address">
    </div>
    <div class="input-group form-group col-sm-4 ">
        <span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
        <input class="form-control" type="password" placeholder="Password">
    </div>
</form>

　　

bootstrap+font-awesome表单的更多相关文章

  1. Bootstrap<基础六> 表单

    Bootstrap 通过一些简单的 HTML 标签和扩展的类即可创建出不同样式的表单. 表单布局 Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 垂直或基本表单 ...

  2. bootstrap上传表单的时候上传的数据默认是0　一定要小心

    bootstrap上传表单的时候上传的数据默认是0 一定要小心

  3. bootstrap+jQuery.validate表单校验

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  4. Bootstrap学习-排版-表单

    1.标题 <h1>~<h6>,所有标题的行高都是1.1(也就是font-size的1.1倍). 2.副标题 <small>,行高都是1,灰色(#999) <h ...

  5. Bootstrap学习(2)--表单

    Bootstrap里的role属性,增强标签的语义化,提高识别力,  如:<form role="form"> input.select.textarea等元素,在Bo ...

  6. 黄聪： Bootstrap之Form表单验证神器： BootstrapValidator（转）

    前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来 ...

  7. Bootstrap系列 -- 21. 表单提示信息

    平常在制作表单验证时,要提供不同的提示信息.在Bootstrap框架中也提供了这样的效果.使用了一个"help-block"样式,将提示信息以块状显示,并且显示在控件底部. < ...

  8. Bootstrap系列 -- 18. 表单控件大小

    前面看到的表单控件都正常的大小.可以通过设置控件的height,line-height,padding和font-size等属性来实现控件的高度设置.不过Bootstrap框架还提供了两个不同的类名, ...

  9. Bootstrap系列 -- 14. 表单控件输入框input

    每一个表单都是由表单控件组成.离开了控件,表单就失去了意义.接下来的我们简单的来了解Bootstrap框架中表单控件的相关知识. 单行输入框,常见的文本输入框,也就是input的type属性值为tex ...

  10. bootstrap 列表 表格 表单 复选 单选 多选 输入框组

    一.列表 ul li 二.表格 table  (http://www.runoob.com/bootstrap/bootstrap-tables.html) 1. 基本表格 <table cla ...

随机推荐

  1. 修改cmd窗口mysql的提示符：

    mysql提示符: \D  完整的日期 \d   当前数据库 \h    服务器地址 \u    当前用户 登录数据库的时候设置提示符:  mysql  -uroot  -proot  --promp ...

  2. spi signal analyze using logic analyzer

    logic analyzer device: Saleae Logic 16 Pc software gui: capture signal picture:   send command 0x55  ...

  3. SQL Server 调优系列进阶篇 - 查询优化器的运行方式

    前言 前面我们的几篇文章介绍了一系列关于运算符的基础介绍,以及各个运算符的优化方式和技巧.其中涵盖:查看执行计划的方式.几种数据集常用的连接方式.联合运算符方式.并行运算符等一系列的我们常见的运算符. ...

  4. win7原版映像中添加usb3.0驱动

    最近用软碟通制作了一个win7原版映像,但是在装新系统的时候发现了一个问题,进入安装界面后,显示没有找到驱动器,但是明明是差了U盘的,通过“shift+f12”调出命令行窗口,输入disk list命 ...

  5. MyEclipse持续性开发教程：用JPA和Spring管理数据（五）

    MyEclipse 3.15 Style——在线购买低至75折!火爆开抢>> [MyEclipse最新版下载] 本教程介绍了MyEclipse中的一些基于JPA / Spring的功能.有 ...

  6. 会话跟踪session

    会话跟踪 HTTP是“无状态”协议:客户程序每次读取Web页面,都打开到web服务器的单独的连接,而且,服务器也不自动维护客户的上下文信息.类似客户决定结账时,如何确定之前创建的购物车中哪个属于此客户 ...

  7. 使用cocoa捕获dock栏中的“退出”事件，解决qt开发的应用程序退出异常的问题

    最近在移植一个QT开发的应用程序到mac平台,由于我们的应用在退出时需要释放一些资源,不然在mac系统会报崩溃事件,但是当用户使用dock栏上面的退出功能时,没有捕获到这个退出事件,导致无法正常退出. ...

  8. 关闭所有的screen

    由于开了很多个screen同时工作,关闭是一个一个比较麻烦,写个命令在这以便日后想不起来时可以用到.1.先看看有多少个screen screen -ls |awk '/Socket/'|awk '{p ...

  9. OpenXml操作Word的一些操作总结．无word组件生成word.（转）

    http://www.cnblogs.com/zhouxin/p/3174936.html OpenXml相对于用MS提供的COM组件来生成WORD,有如下优势: 1.相对于MS 的COM组件,因为版 ...

  10. solr学习三（测试类，含普通与ExtractingRequestHandler测试）

    solr客户端基本是配置出来的,服务端可以对其进行测试,我使用的是solrj服务端. 如果初学solr,先使用普通的测试类: import java.io.IOException; import ja ...