-1

我在我的 MVC 视图中使用 Twitter Bootsrap 3 并且有一个问题:

我注意到我的输入框是方形的,当聚焦时,边缘周围有橙色高光。他们也被挤在一起。

我已经尝试了一切来获得带有圆角和浅蓝色高光的输入框。我还需要在每个框之间自动应用间距。

我可以使用哪个表单类来实现所需的行为?

<body>
    <div class="container well login-form">
        <div class="logo fullsize"></div>
        @using (Html.BeginForm(new { ReturnUrl = ViewBag.ReturnUrl }))
        {
            @Html.AntiForgeryToken()
            @Html.ValidationSummary(true)

            <fieldset>
                <legend>Welcome!</legend>
                <div>
                    @Html.LabelFor(m => m.UserName)
                    @Html.TextBoxFor(m => m.UserName, new { placeholder = "type your username" })
                    @Html.ValidationMessageFor(m => m.UserName)
                </div>
                <div>
                    @Html.LabelFor(m => m.Password)
                    @Html.PasswordFor(m => m.Password, new { placeholder = "type your password" })
                    @Html.ValidationMessageFor(m => m.Password)
                </div>
                 <div>
                    @Html.LabelFor(m => m.PartnerAccessCode)
                    @Html.PasswordFor(m => m.PartnerAccessCode, new { placeholder = "partner access code" })
                    @Html.ValidationMessageFor(m => m.PartnerAccessCode)
                </div>
                <div>
                    <label class="checkbox">
                        @Html.CheckBoxFor(m => m.RememberMe)
                        Remember
                    </label>
                </div>
                <input type="hidden" name="returnUrl" value="@ViewBag.ReturnUrl" />
                <input type="submit" value="Log in" class="btn-lg btn-success " onclick="$('form').submit()"/>
            </fieldset>
            <br/>
            <p>
                @Html.ActionLink("Register", "Register") if you don't have an account.
            </p>
        }
    </div>
</body>
4

2 回答 2

1

您需要input-control该类来实现圆角和蓝色高光。

于 2013-08-17T15:06:33.810 回答
0

引导文档中对所有内容进行了精彩的解释。请看一下: http: //getbootstrap.com/css/

在您的情况下,使用“form-control”类应该可以工作:

 <input class="form-control" type="hidden" name="returnUrl" value="@ViewBag.ReturnUrl" />
 <input class="form-control" type="submit" value="Log in" class="btn-lg btn-success " onclick="$('form').submit()"/>

您可以查看一些方便的引导示例以开始使用:https ://github.com/juthilo/bootstrap-examples

于 2013-08-17T18:05:35.467 回答