<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>Bootstrap 实例 - 内联表单</title>

        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

        <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

        <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    </head>

    <body>

        <form class="form-inline" role="form">

            <div class="form-group">

                <label class="sr-only" for="name">名称</label>

                <input type="text" class="form-control" id="name"

                       placeholder="请输入名称">

            </div>

            <div class="form-group">

                <label class="sr-only" for="inputfile">文件输入</label>

                <input type="file" id="inputfile">

            </div>

            <div class="checkbox">

                <label>

                    <input type="checkbox"> 请打勾

                </label>

            </div>

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

        </form>

    </body>

</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：内联表单的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：复选框（Checkbox）和单选框（Radio）

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

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：内联子标题

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

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 显示代码

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

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：列表

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

  5. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单帮助文本

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

  6. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单控件大小

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

  7. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单控件状态

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

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

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

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单

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

随机推荐

  1. tp5的输入和验证

    规则和模板 好像要写一样名字,只需要引入模板

  2. EF 查询表达式 join

    数据源: 1.无into,相当于 inner join var query = from p in context.P join s in context.S on p.PID equals s.PI ...

  3. JS-this的使用

    做前端开发已经半年之多了,前几天看见apply时心生疑惑,于是查阅了好多资料但还是不太理解,只知道是源于this的问题,今天偶然看到了阮一峰大佬的讲解js中的this问题(http://www.rua ...

  4. 移动端，ajax 动态加载的元素，为动态添加的一系列同个类名的元素添加点击事件

    背景:一个列表页,有一系列同类名的元素,需要为每一个动态添加的列表项添加事件: 点击选择下图中不同的文档类型,再通过 ajax 动态加载不同的文档. 使用过的方法: 1.通知 jquery 的 $(s ...

  5. XMPP详解

    https://www.jianshu.com/p/84d15683b61e https://www.cnblogs.com/lurenq/p/7026983.html 1. xmpp简介 XMPP ...

  6. redis是单进程数据库，多用户排队对统一数据进行访问，不存在并发访问生产的线程安全问题

    redis是单进程数据库,多用户排队对统一数据进行访问,不存在并发访问生产的线程安全问题. oracle是多进程数据库,存在并发访问的问题,必须事务加锁等方式进行处理.

  7. PB 数据窗口点击标题不能排序的一个原因

    标题必须和数据行名称一致,如 数据行列名为:num ,标题行必须为 num_t 才可以

  8. CN109241772A发票区块链记录方法、装置、区块链网关服务器和介质（腾讯）

    学习笔记-2 CN109241772A发票区块链记录方法.装置.区块链网关服务器和介质(腾讯) 解决什么问题? 让发票信息记录到区块链的情况下减少发票信息泄露 链上有什么数据? 发行发票事件信息(发票 ...

  9. socket中文奇数个出现乱码的解决办法

    用MyEclipse试了一下JAVA获取系统正在运行进程代码,结果Console输出的时候中文部分输出为乱码,在网上找了很多办法,都没有解决问题.后来发现一个方法,解决了问题,特此分享. 下面成功解决 ...

  10. I/O-<File实例>

    File n=new File("D:\2016.txt"); System.out.println("文件是否存在"+n.exists()); System. ...