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. Nginx在windows上安装 及 Nginx的配置及优化

    https://www.cnblogs.com/Chiler/p/8027167.html http://www.runoob.com/linux/nginx-install-setup.html 前 ...

  2. BZOJ1670 [Usaco2006 Oct]Building the Moat护城河的挖掘

    裸的凸包...(和旋转卡壳有什么关系吗...蒟蒻求教T T) 话说忘了怎么写了...(我以前都是先做上凸壳再做下凸壳的说) 于是看了下hzwer的写法,用了向量的点积,方便多了,于是果断学习(Orz) ...

  3. PHP:第三章——PHP中控制函数的函数

    <pre> <?php header("Content-Type:text/html;charset=utf-8"); /******************** ...

  4. ajax post提交空字符串(string.Empty) MVC接收为null的问题

    ajax post提交空字符串(string.Empty) MVC接收为null的问题 这个问题查了好多资料才知道原因: if (bindingContext.ModelMetadata.Conver ...

  5. git reset --hard和git revert命令

      git reset --hard和git revert命令   git误操作时可以用git reset –hard 去撤销这次修改, 但是这样做也有问题,可能在之前本地有没有提交的修改也都消失了, ...

  6. noip2005循环

    题解: 迭代,一次次k累加计算 代码: #include<bits/stdc++.h> using namespace std; ; ][N],ans[N]; char s[N]; boo ...

  7. 返回值为record类型的函 初始化 内存泄漏 复制

    1.函数需要初始化,否则下次调用函数时,Result还是上次的值,可能会引起误判.但是不会有内存泄漏,即使包含string类型的成员. 2.如果record包含的都是值类型的成员,比如integer, ...

  8. Mitmproxy介绍及Python拦截代理

    使用 mitmproxy + python 做拦截代理 转自:https://blog.wolfogre.com/posts/usage-of-mitmproxy/   本文是一个较为完整的 mitm ...

  9. Linux下mysql操作

    1.linux下MYSQL的启动与访问 http://www.cnblogs.com/hunter007/articles/2251795.html 2.linux下mysql基本的操作 http:/ ...

  10. magento首页点击任何产品都出现404错误的问题方法

    很简单,只要在其他项目上的根目录上复制一个.htaccess文件到项目跟目录下就可以 了,其实就是是设置伪静态: