可用的bootrap摸态框样式

最新推荐文章于 2023-04-04 20:41:26 发布

wangc_gogo

最新推荐文章于 2023-04-04 20:41:26 发布

阅读量351

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/wangc_gogo/article/details/104671401

版权

js 专栏收录该内容

52 篇文章 0 订阅

订阅专栏

<div class="fixed-table-toolbar">
    <!-- 按钮触发模态框 -->
    <div class="columns columns-right btn-group pull-right">
        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">新增项目</button>
    </div>
    <!-- 模态框（Modal） -->
    <form action="/addProject/" method="post" class="form-horizontal" role="form">
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                            &times;
                        </button>
                        <h4 class="modal-title" id="myModalLabel">
                            新增项目
                        </h4>
                    </div>
                    <!--模态框body-->
                    <div class="modal-body" style="height: 150px;">
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">任务名称：</label>
                            <div class="col-sm-7">
                                <input type="text" class="form-control"  name="taskName"
                                       placeholder="任务名称">
                            </div>
                        </div>

                        <div class="form-group">
                            <label  class="col-sm-3 control-label">时间表达式:</label>
                            <div class="col-sm-7">
                                <input type="text" class="form-control"  name="cornEl"
                                       placeholder="时间表达式">
                            </div>
                        </div>

                        <div class="form-group">
                            <label  class="col-sm-3 control-label">方法名</label>
                            <div class="col-sm-7">
                                <input type="text" class="form-control"  name="methodName"
                                       placeholder="执行方法名">
                            </div>
                        </div>

                    </div>
                    <!--模态框底部-->
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <input type="button" class="btn btn-primary"value="提交"/>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
        </div>
    </form>
</div>