我将要创建一个新的ASP.Net MVC5的Web应用程序。 我想在应用程序中使用一个主题从bootswatch或wrapbootstrap,却找不到一套关于如何做到这一点的说明。
Answer 1:
申请主题的步骤是相当简单的。 要真正了解一切是如何一起工作,你需要明白什么是ASP.NET MVC 5模板提供开箱即用,以及如何你可以自定义您的需求。
注意:如果你的MVC 5模板是如何工作的一个基本的了解,向下滚动到主题化部分。
ASP.NET MVC 5模板:它是如何工作
本演练提供了如何创建一个MVC 5项目,什么是引擎盖下回事 。 见MVC 5模板的所有功能, 这个博客 。
创建一个新项目。 在模板选择网络 > ASP.NET Web应用程序 。 输入您的项目名称,然后单击确定 。
在接下来的向导中,选择MVC,然后单击确定 。 这将适用于MVC 5模板。
在MVC 5模板创建一个使用引导程序来提供响应式设计和主题化特征的MVC应用程序。 引擎盖下,所述模板包括一自举3. * NuGet包 ,它安装4个文件:
bootstrap.css
,bootstrap.min.css
,bootstrap.js
,和bootstrap.min.js
。自举是在应用程序中使用Web优化功能捆绑在一起。 检查
Views/Shared/_Layout.cshtml
和寻找@Styles.Render("~/Content/css")
和
@Scripts.Render("~/bundles/bootstrap")
这两条路径是指在设置捆
App_Start/BundleConfig.cs
:bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include( "~/Scripts/bootstrap.js", "~/Scripts/respond.js")); bundles.Add(new StyleBundle("~/Content/css").Include( "~/Content/bootstrap.css", "~/Content/site.css"));
这是什么使得它可以运行没有任何配置了前您的应用程序。 现在,尝试运行项目。
在ASP.NET应用引导主题MVC 5
本演练涵盖了如何在MVC 5项目申请自举的主题
- 首先,下载
css
要应用的主题。 在这个例子中,我将使用Bootswatch的断然 。 包括将下载的flatly.bootstrap.css
和flatly.bootstrap.min.css
在Content
文件夹(一定要在项目以包括为好)。 打开
App_Start/BundleConfig.cs
并更改以下:bundles.Add(new StyleBundle("~/Content/css").Include( "~/Content/bootstrap.css", "~/Content/site.css"));
以包含新的主题:
bundles.Add(new StyleBundle("~/Content/css").Include( "~/Content/flatly.bootstrap.css", "~/Content/site.css"));
如果您使用的是默认
_Layout.cshtml
包含在MVC 5模板,你可以跳到步骤4.如果不是,作为最低限度,包括与您一起布局这两个线引导HTML模板 :在你
<head>
:@Styles.Render("~/Content/css")
关闭前最后一行
</body>
@Scripts.Render("~/bundles/bootstrap")
现在,尝试运行项目。 您应该看到新创建的应用程序现在使用你的主题。
资源
看看这真棒30天步行通过引导由詹姆斯·钱伯斯了解更多信息,教程,技巧和窍门如何使用Twitter的引导与ASP.NET MVC 5。
- 引导
- 引导在Visual Studio 2013的Web项目模板
- 入门ASP.NET MVC 5
- 引导3与ASP.NET MVC 5 -分步由星星
- Bootswatch -自举免费的主题
Answer 2:
这可能是有点晚了; 但有人会觉得它有用。
有一个NuGet包集成AdminLTE - 一个流行的引导模板 - 到MVC5
只需在您的Visual Studio程序包管理器控制台运行此命令
Install-Package AdminLteMvc
注:这可能需要一段时间来安装,因为它下载所有必需的文件,以及创建可引导您开发的样品全部或部分视图(.cshtml文件)。 样品布局文件_AdminLteLayout.cshtml
也被提供。
你会发现在文件~/Views/Shared/
文件夹
Answer 3:
首先,如果你能找到你
bootstrap.css文件
和
bootstrap.min.js文件
在你的电脑,那么你刚才做的是
首先从下载您喜欢的主题,即http://bootswatch.com/
复制下载bootstrap.css和bootstrap.min.js文件
然后在你的电脑找到现有文件并用新下载的文件替换它们。
注:确保您下载的文件重命名 ,什么是你的文件夹中
即
然后,你是好去。
有时会导致可能不会立即显示。 您可能需要在浏览器上令人耳目一新的方式运行的CSS
Answer 4:
我有MSDN上的一篇文章 - 使用VS 2012的自定义主题,引导/布局创建ASP.NET MVC,VS 2013和VS 2015年,也有附加演示代码示例。请参考以下链接。 https://code.msdn.microsoft.com/ASPNET-MVC-application-62ffc106
Answer 5:
所有您需要做的是选择和下载从Bootswatch网站bootstrap.css和bootstrap.js文件,然后用它们替换原来的文件。
当然,你必须是所有的jQuery的路径后的路径添加到您的页面布局。