bootstrap 基础表单 内联表单 横向表单

<!DOCTYPE html>

<html>

<head>

    <title></title>

    <meta charset="utf-8">

    <link rel="stylesheet" type="text/css" href="dist/css/bootstrap.css">

</head>

<body>

    <p class="btn-primary">基础表单</p>

    <form>

        <fieldset>

            <legend>User Login</legend>

            <div class="form-group">

                <label for="">User</label>

                <input type="email" class="form-control" placeholder="this is email input">

            </div>

            <div class="form-group">

                <label for="">Pass</label>

                <input type="password" class="form-control" placeholder="this is for password">

            </div>

            <div class="checkbox">

                <label for="">

                    <input type="checkbox">ABC</input>

                </label>

            </div>

            <button type="submit" class="btn btn-default">Login</button>

        </fieldset>

    </form>

    <p class="btn-primary">内联表单</p>

    <form class="form-inline">

        <div class="form-group">

            <label for="">User</label>

        </div>

        <div class="form-group">

            <input type="text" class="form-control" placeholder="this is for user">

        </div>

        <div class="checkbox">

            <label for="chk2">

                <input id="chk2" type="checkbox">Remember Pass</label>

        </div>

        <button type="submit" class="btn btn-default">Login</button>

    </form>

    <p class="btn-primary">横向表单</p>

    <form action="" class="form-horizontal" role="form">

        <div class="form-group">

            <label for="account" class="col-sm-2 control-label">UserName</label>

            <div class="col-sm-10">

                <input type="email" class="form-control" id="account" placeholder="account place holder">

            </div>

        </div>

        <div class="form-group">

            <div class="col-sm-offset-2 col-sm-10">

                <div class="checkbox">

                    <label for="chk">

                        <input id="chk" type="checkbox">remember me</label>

                </div>

            </div>

        </div>

    </form>

    <script type="text/javascript" src="dist/jQuery/jquery-1.11.3.js"></script>

    <script type="text/javascript" src="dist/js/bootstrap.js"></script>

</body>

</html>

bootstrap 基础表单 内联表单 横向表单的更多相关文章

  1. sql:除非另外还指定了 TOP 或 FOR XML，否则，ORDER BY 子句在视图、内联函数、派生表、子查询

    执行sql语句: select * from ( select * from tab where ID>20 order by userID desc ) as a order by date ...

  2. ORDER BY 子句在视 图、内联函数、派生表、子查询和公用表表达式中无效

    SQL语句: select * from (select distinct t2.issue,cashmoney from (select distinct issue from lot_gamepa ...

  3. [转]sql:除非另外还指定了 TOP 或 FOR XML，否则，ORDER BY 子句在视图、内联函数、派生表、子查询

    执行sql语句: select * from ( select * from tab where ID>20 order by userID desc ) as a order by date ...

  4. [sql Server]除非另外还指定了TOP 或 FOR XML，否则，ORDER BY 子句在视图、内联函数、派生表、子查询和公用表表达式中无效

    今天遇到一个奇怪的问题,项目突然要从mysql切换到sql server数据库,包含order by 子句的嵌套子查询报错. 示例:select top 10 name,age,sex from ( ...

  5. [每日一题] OCP1z0-047 :2013-07-30 表连接――内联视图当作表使用

    用sys用户登录,给oe用户授权dba,以便可以用oe用户查看执行计划: oe@OCM> conn / as sysdba Connected. sys@OCM> grant dba to ...

  6. JavaScript的DOM_StyleSheet操作内联或链接样式表

    使用 style 属性,仅仅只能获取和设置行内的样式,如果是通过内联<style>或链接<link>提供的样式规则就无可奈何了,使用 getComputedStyle 和cur ...

  7. C++语言基础(7)-inline内联函数

    函数调用是有时间和空间开销的.程序在执行一个函数之前需要做一些准备工作,要将实参.局部变量.返回地址以及若干寄存器都压入栈中,然后才能执行函数体中的代码:函数体中的代码执行完毕后还要清理现场,将之前压 ...

  8. 除非另外还指定了 TOP 或 FOR XML，否则，ORDER BY 子句在视图、内联函数、派生表、子查询和公用表表达式中无效。

    在 SELECT 后加 TOP 100 PERCENT .

  9. Code笔记之：CSS块级元素、内联元素概念

    文档流 将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流. 每个非浮动块级元素都独占一行, 浮动元素则按规定浮在行的一端. 若当前行容不下, 则另起新行再浮动. 内联元素也不 ...

随机推荐

  1. Combox下拉绑定DataGridView

    这个Combox下拉很多人都在用  但其中绘制的语句如下: #endregion #region 方法 #region 绘制DataGridView以及下拉DataGridView private v ...

  2. 操作IFRAME及元素

    内容里有两个ifame <iframe id="leftiframe"...</iframe> <iframe id="mainiframe..& ...

  3. CSS——宽高问题大汇总

    1.宽高继承 他们是要属性的,并不是直接就能继承,inherit. 2.浮动的盒子不要给宽,宽度由内容来决定

  4. With PHP frameworks, why is the “route” concept used?

    http://programmers.stackexchange.com/questions/122190/with-php-frameworks-why-is-the-route-concept-u ...

  5. 【转贴】 Flex 预编译处理 与 手机项目、Web项目、Air项目自由转换

    原文连接: http://bbs.9ria.com/forum.php?mod=viewthread&tid=263350#lastpost 由于这个论坛不稳定,所以转到这里来,这个帖子蛮有用 ...

  6. centos7中yum安装ntfs-3g

    CentOS默认源里没有ntfs3g,想要添加ntfs支持,无非是自己下载编译安装或者加源yum安装. 新安装了一个CentOS7,用的是添加aliyun的epel源来yum安装的方式,简单易行. 1 ...

  7. [Unity Shader]Shader前述

    什么是Shader   Shader,也就是着色器,它的工作就是读取你的网格并渲染在屏幕上.Shader可以定义一些属性,你会用它来影响渲染模型时所显示的效果.当存储了这些属性的设置时,就是一个Mat ...

  8. iOS8学习笔记2--autolayout

    iOS支持的设备如今已经具有了很多的尺寸,针对这些不同的尺寸每一个都做一个独立的APP肯定是不现实的,于是苹果在iOS8之后推出了autolayout和sizeclass,同时还有VFL界面设计语言 ...

  9. 分析$.isPlainObject

    作者:zccst 本次学习$.isPlainObject,是不是一个普通对象.测试对象是否是纯粹的对象(通过 "{}" 或者 "new Object" 创建的) ...

  10. LPC1768的USB-相关结构体定义

    #ifndef __USB_H__ #define __USB_H__ //usb传输数据的宏定义描述 #include "sys.h" typedef __packed unio ...