吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：内联表单

最新推荐文章于 2024-04-29 17:54:33 发布

weixin_30332241

最新推荐文章于 2024-04-29 17:54:33 发布

阅读量77

点赞数

文章标签：前端框架 javascript ViewUI

原文链接：http://www.cnblogs.com/tszr/p/10888598.html

版权

<!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>

转载于:https://www.cnblogs.com/tszr/p/10888598.html

weixin_30332241

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：内联表单

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Bootstrap 实例 - 内联表单</title> <link rel="stylesheet" href="htt...
复制链接

扫一扫