ASP.NET MVC 5 and Bootstrap 3 CSS Framework

ASP.NET MVC 5 and Bootstrap 3 CSS Framework

ASP.NET MVC 5 uses Bootstrap 3 as the CSS Framework in its default ASP.NET Web Application Tempate. This is a nice touch as most ASP.NET MVC developers have at least played with Bootstrap and are designing responsive websites. I'll mention the use of Bootstrap here briefly as there really isn't much to it. Feel free to read my other ASP.NET MVC 5 Tutorials on the new features in ASP.NET MVC 5: ASP.NET MVC 5 Attribute Routing and Filter Overrides in ASP.NET MVC 5.

ASP.NET MVC 5 and Bootstrap 3

When you create a new ASP.NET MVC 5 Web Application in Visual Studio 2013 it is using Bootstrap 3 as its default CSS Framework. You get the pleasure of the responsive navigation and website along with all the typography and other bells and whistles you expect from Bootstrap 3.

ASP.NET MVC 5 and Bootstrap 3

Inside the ASP.NET MVC 5 Website Template you will find the bootstrap.css and bootstrap.min.css stylesheets as well as the bootstrap.js and bootstrap.min.js scripts. The _Layout.cshtml view and other views are marked up appropriately using the CSS selectors in Bootstrap 3.

ASP.NET MVC 5 Bootstrap Bundles

By default, the ASP.NET MVC Website Template uses a couple of bundles that use both Bootstrap 3 CSS as well as Modernizr. Check out the Layout.cshtml view to see the use of two of the bundles.

  @Styles.Render("~/Content/css")
  @Scripts.Render("~/bundles/modernizr")

You will find these bundles configured in the BundleConfig.cs file in App_Start.

  bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
    "~/Scripts/modernizr-*"));

  bundles.Add(new StyleBundle("~/Content/css").Include(
    "~/Content/bootstrap.css",
    "~/Content/site.css"));

And, of course, the CSS selectors and markup in the new ASP.NET MVC 5 Views are based on Bootstrap 3.

Conclusion

This isn't a huge deal, but it's still nice to see ASP.NET MVC 5 using Bootstrap 3 by default. Certainly, you can remove it for Foundation, Skeleton, or other CSS and JavaScript Framework of your choice. You can check out other ASP.NET MVC 5 Tutorials.

Follow me on Google+ and Twitter!