ASP.NET MVC 5 和 Bootstrap 3

Question

在网络上寻找更多信息，但未能找到太多内容。

因此我在VS 2013 RC中创建了一个新的MVC 5项目，该项目预装有bootstrap 2.3.1。

一切都非常顺利，但由于Bootstrap 3已经发布（我想使用LESS版本而不是预编译CSS），所以我从NuGet中移除了bootstrap 2.3.1并安装了Bootstrap LESS。

我知道文件夹结构略有不同，但我已编辑我的BundleConfig以适应该变化。一切似乎都编译正常，所有JS文件都在，但在尝试查看网页时，它看起来很混乱。

Bootstrap 3是否具有完全不同的HTML 模板（即我需要更改_Layout）或者说2.3.1中的_Layout也适用于v3？

希望我的问题清楚明了。

- teh0wner

---

请确保将问题标记为已解答，否则您可能会难以让人们花时间回答未来的问题。 - Ryan McDonough

Answer 1

Bootstrap 3和Bootstrap 2.3.1之间存在一些差异。

我对我的_Layout进行了一些更改，使其更加适用于Bootstrap 3。

    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex5-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        @Html.ActionLink("Application name", "Index", "Home", null, new { @class = "navbar-brand" })
    </div>

    <div class="collapse navbar-collapse navbar-ex5-collapse">
        <ul class="nav navbar-nav">
            <li>@Html.ActionLink("Home", "Index", "Home")</li>
            <li>@Html.ActionLink("About", "About", "Home")</li>
            <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
        </ul>
        @Html.Partial("_LoginPartial")
    </div>
</nav>

- Olav Nybø

---

请注意，Bootstrap ASP验证需要进行一些微调，因为它依赖于旧的HTML结构。 - Ryan McDonough

太好了，这正是我在寻找的！另外，我还发现了这个链接：http://www.ghislainproulx.net/Blog/2013/09/using-bootstrap-3-with-visual-studio-2013-aspnet-mvc-template那么，@RyanMcDonough，你会如何处理呢？ - teh0wner

基本上按照那个指南操作，它包括验证方面的更新。 - Ryan McDonough

Answer 2

Bootstrap 3对各种HTML做了改变，因此需要在某些地方使用不同的HTML。您可以通过查看他们的文档页面来轻松确认。

- Dmitry Efimenko

Answer 3

还有一件事需要记住；如果您正在使用不显眼的验证，您需要更新包才能使客户端验证工作。

Update-Package Microsoft.Jquery.Unobtrusive.Validation

否则，您的页面将会提交以进行验证。

- user1575089