程序员的资源宝库

网站首页 > gitee 正文

关于boostrap 排版问题

sanyeah 2024-04-09 20:02:55 gitee 9 ℃ 0 评论

直接上代码

    <div class="card-header">
        <div class="page-header">
            <div class="container">
                <form class="form-horizontal" role="form">
                    <div class="row form-group">
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">品牌</label>
                            <div class="col-sm-10">
                                @Html.DropDownList("brandId", ViewData["brand_id"] as IEnumerable<SelectListItem>, "请选择", new { @class = "form-control" })
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">城市</label>
                            <div class="col-sm-10">
                                @Html.DropDownList("cityId", ViewData["city_id"] as IEnumerable<SelectListItem>, "请选择", new { @class = "form-control" })
                            </div>
                        </div>
                    </div>

                    <div class="row form-group">
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">门店</label>
                            <div class="col-sm-10">
                                @Html.DropDownList("restId", ViewData["rest_id"] as IEnumerable<SelectListItem>, "请选择", new { @class = "form-control" })
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">订单类型</label>
                            <div class="col-sm-10">
                                @Html.DropDownList("checkType", ViewData["check_type"] as IEnumerable<SelectListItem>, "请选择", new { @class = "form-control" })
                            </div>
                        </div>
                    </div>
                    <div class="row form-group">
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">姓名</label>
                            <div class="col-sm-10">
                                @Html.Editor("custName", "", new { htmlAttributes = new { @class = "form-control", maxlength = "20" } })
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">手机号</label>
                            <div class="col-sm-10">
                                @Html.Editor("custPhone", "", new { htmlAttributes = new { @class = "form-control", maxlength = "11" } })
                            </div>
                        </div>
                    </div>
                    <div class="row form-group">
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">下单时间</label>
                            <div class="col-sm-5">
                                <div class="input-group date">
                                    <input type="text" class="form-control onlyDate" id="startDate">
                                    <span class="input-group-addon">
                                        <i class="glyphicon glyphicon-calendar"></i>
                                    </span>
                                </div>
                            </div>
                            <div class="col-sm-5">
                                <div class="input-group date">
                                    <input type="text" class="form-control onlyDate" id="endDate">
                                    <span class="input-group-addon">
                                        <i class="glyphicon glyphicon-calendar"></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            <label for="" class="col-sm-2 control-label text-right">支付渠道</label>
                            <div class="col-sm-10">
                                @Html.DropDownList("PaymentType", ViewData["payment_type"] as IEnumerable<SelectListItem>, "请选择", new { @class = "form-control" })
                            </div>
                        </div>
                    </div>
                    <div class="row form-group">
                        <div class="col-sm-offset-4 col-sm-2">
                            <button type="button" id="btnSearch" class="btn btn-block btn-small btn-info">检索</button>
                        </div>
                        <div class="col-sm-2">
                            <button type="button" id="btnClear" class="btn btn-block btn-small btn-info">清空</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

 

 

显示效果

 

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表