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. this常见错误

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...

  2. Amaze UI 发布基于jQuery新版本v2.0.0之web组件

    首先Amaze Ui第一版时我收到邮件邀请去试用,去了官网看了下,是基于zepto.js的一个类似bootstrap的响应式框架,提到框架当然是好事,快速开发呗.这词2.0的弃用zepto.js改用j ...

  3. C++对象模型——默认构造函数的合成

    最近在学习C++对象模型,看的书是侯捷老师的<深度探索C++对象模型>,发现自己以前对构造函数存在很多误解,作此笔记记录. 默认构造函数的误解 1.当程序猿定义了默认构造函数,编译器就会直 ...

  4. 【转载】maven入门1

    学习maven的使用,看到一篇很实用的入门教程(菜鸟级入门) 2007-08-28 14:01:04 标签:maven 职场 休闲 一.前言         早就知道maven 在java 项目的管理 ...

  5. js方法参数问题

    大家都知道java是强类型语言,而js是弱类型语言,其实,它们之间的区别不止这一点,还有方法参数及调用问题,参看下例: js中:这里定义了一个query()方法 function query() { ...

  6. winform 窗体换皮肤，IrisSkin2.dll的用法

    1. 先把IrisSkin2.dll文件添加到当前项目引用(解决方案资源管理器->当前项目->引用->右键->添加引用,找到IrisSkin2.dll文件.....之后就不用我 ...

  7. "Incorrect string value: '\\xE7\\x89\\x8C\\xE5\\xB1\\x80...' for column 'name' at row 1")

    出现这个错误的原因是,数据库的编码格式为latin1 而我要将utf8的中文插入到数据库中. mysql> alter database xxx default character set ut ...

  8. linux rinetd、socat端口转发部署（很实用的网络工具）

    端口转发映射的程序叫rinetd,下载地址,直接manke编译安装即可. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 [root@PortForward02 src] ...

  9. HTML第三课——css盒子

    请关注公众号:自动化测试实战 css常用属性 width 宽 height 高 color 字体颜色 border 边框 background 背景 lesson3.html <!DOCTYPE ...

  10. Assert随笔

    ☆ Assert.notNull(haha, "未找到需要导入的计划1");//haha必须不能为null,if为null则抛出message的异常: Assert.hasText ...