Razor列定义

Question

我的剃刀代码，创建此布局。

但我不喜欢职位。我会这样的。

如何创建上面的图像？

这是我的剃刀代码。

     <div class="form-group">

                    @Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" })
                    <div class="col-md-4">
                        @using (DAEF.DA_Mit daef = new DAEF.DA_Mit())
                        {
                            @Html.DropDownListFor(
                          model => model.CodMit,
                          new SelectList(daef.SelectAll(), "CodMit", "ItemPerDropdown"), new { @class = "form-control" })
                        }
                        @Html.ValidationMessageFor(model => model.CodMit, "", new { @class = "text-danger" })
                    </div>


                    @Html.LabelFor(model => model.CodCreator, new { @class = "control-label col-md-2" })
                    <div class="col-md-4">
                        @using (DAEF.DA_Mit daef = new DAEF.DA_Mit())
                        {
                            @Html.DropDownListFor(
                            model => model.CodCreator,
                            new SelectList(daef.SelectAll(), "CodMit", "ItemPerDropdown"), new { @class = "form-control" })
                        }
                        @Html.ValidationMessageFor(model => model.CodMit, "", new { @class = "text-danger" })
                    </div>

                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.Info, new { @class = "control-label col-sm-2" })
                    <div class="col-sm-4">
                        @Html.TextAreaFor(model => model.Info, new { @class = "form-control", rows = 4 })
                        @Html.ValidationMessageFor(model => model.Info, "", new { @class = "text-danger" })
                    </div>
                </div>

            </div>

有人可以帮我吗？

Answer 1

最后一次

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

必须是

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

和另外两个

<div class="col-md-4">

必须是

<div class="col-md-6">

并且还制作两个分隔的组而不是两个嵌套组

有关所用网格系统的更多信息：https://v4-alpha.getbootstrap.com/layout/grid/