在ASP.NET MVC项目中,可以在视图中利用Scripts.Render、Styles.Render统一加载js、css文件,需要利用BundleConfig类来Add 各种Bundle,例如:bundles.Add(new StyleBundle("~/Content1").Include("~/Content/common。css", "~/Content/content。css"))

一、配置BundleConfig.cs文件

1、首先要在App_Start 里面BundleConfig.cs 文件里面 添加要包含的css文件

2、BundleConfig就是一个微软新加的 一个打包的配置类

3、BundleConfig用来Add 各种Bundle

4、BundleConfig配置信息如图:

public class BundleConfig {
public static void RegisterBundles(BundleCollection bundles) {
bundles.Add(new ScriptBundle("~/bundles/jquery").Include("~/Scripts/jquery-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include("~/Scripts/jquery-ui-{version}.js"));

bundles.Add(new StyleBundle("~/Content1/css").Include("~/Content/site.css"));
bundles.Add(new StyleBundle("~/Content1/themes/base/css").Include(
"~/Content/themes/base/jquery.ui.core.css",
"~/Content/themes/base/jquery.ui.resizable.css",
"~/Content/themes/base/jquery.ui.selectable.css",
"~/Content/themes/base/jquery.ui.accordion.css",
"~/Content/themes/base/jquery.ui.autocomplete.css",
"~/Content/themes/base/jquery.ui.theme.css"));
}
}
 5、配置信息说明

(1)、上面的"~/Content1" 是虚拟路径,可以随便起名,用于标记打包哪个文件夹下面的.css 文件,后面的Include方法接受的是一个string[] 根据传入的路径去对css文件进行打包。

(2)、使用Bundle来引用css有个好处 就是可以把多个css文件在一起请求,浏览器只发一次请求 不过必须在Global.asax里面 加一段代码 BundleTable.EnableOptimizations = true 来启用优化。

(3)、在启用优化后,当页面下次再次发送请求的时候 BundleConfig里面没有更改的话 浏览器会从缓存中去取


二、使用Scripts.Render、Styles.Render引用BundleConfig中的配置

1、在视图文件中使用Scripts.Render()输出脚本包,Styles.Render()输出样式包

2、Script文件引用:@Scripts.Render(virtualPath[,virtualPath1][,virtualPath2][,...])

3、CSS文件引用:  @Styles.Render(virtualPath[,virtualPath1][,virtualPath2][,...])

4、实例



<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
@Styles.Render("~/Content1/css")
</head>
<body>
@RenderBody() @Scripts.Render("~/bundles/jqueryui")
</body>
</html>

 
												

MVC 中Scripts.Render、Styles.Render的更多相关文章

  1. ASP.NET MVC 4 (十一) Bundles和显示模式--asp.net mvc中 @Scripts.Render("~/bundles/jquery")是什么意思? 在布局文件中使用Scripts.Render()输出脚本包,Styles.Render()输出风格包:

    ASP.NET MVC 4 (十一) Bundles和显示模式 ASP.NET MVC 4 引入的js打包压缩功能.打包压缩jquery目录下的文件,在布局文件中使用Scripts.Render()输 ...

  2. mvc中Scripts.Render、Styles.Render

    一.配置BundleConfig.cs文件 1.首先要在App_Start 里面BundleConfig.cs 文件里面 添加要包含的css文件 2.BundleConfig就是一个微软新加的 一个打 ...

  3. mvc中Scripts.Render的用法

    第一次接触新的东西,都会很陌生,但是时间久了就熟悉了变简单了. 视图文件中使用Scripts.Render()输出脚本包,Styles.Render()输出样式包 上面两张图是我所做项目里的,放上面会 ...

  4. 在_Layout模版中使用@Styles.Render()没有效果

    刚才有测试一个功能,就是在_Layout母版中使用了@Styles.Render()时行Render样式文件,所有在此母版下的视图均没有应用到样式,没有效果.是什么原因? 经查证资料,原来Insus. ...

  5. ASP.NET MVC 4 RC的JS/CSS打包压缩功能 Scripts.Render和Styles.Render

    打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载多个文件案才能完成网页显示的延迟感,同时通过移除JS/CSS ...

  6. [ASP.NET MVC]@Scripts.Render、@Styles.Render的使用

    一.配置BundleConfig.cs文件 1.首先要在App_Start 里面BundleConfig.cs 文件里面 添加要包含的css文件 2.BundleConfig就是一个微软新加的 一个打 ...

  7. c# MVC中 @Styles.Render索引超出下标

    @Styles.Render( "~/Content/bootstrap/css", "~/Content/mycss") 提示索引超出下标 后来发现市boot ...

  8. 关于MVC4.0中@Styles.Render用法与详解

    本文分享于http://keleyi.com/a/bjac/q74dybjc.htm文章,感觉写的蛮好所以就拿过来做笔记了,希望对大家有帮助 最近公司的新项目用了MVC 4.0,接下来一步步把 工作中 ...

  9. 【MVC】Scripts.Render的用法

    一.配置BundleConfig.cs文件 1.首先要在App_Start 里面BundleConfig.cs 文件里面 添加要包含的css文件2.BundleConfig就是一个微软新加的 一个打包 ...

随机推荐

  1. ES6的小知识(前半部分)

    一.let与const的使用 let:用来声明一个变量,与var类似 1.用let声明的变量,所声明的变量只在命令所在的代码块内有效 function hander(){ let a = 10; co ...

  2. linux存储管理之mount挂载

    Mount 挂载详解 ====================================================================================本节内容: ...

  3. yii2常用路径获取

    public function actionGetUrlList() { echo "当前域名地址:".Yii::$app->request->hostInfo.&qu ...

  4. html和jsp区别

    html和jsp的区别及优缺点   ♥ HTML(Hypertext Markup Language)文本标记语言,它是静态页面,和JavaScript一样解释性语言,为什么说是解释性语言呢?因为,只 ...

  5. 使用ssm(spring+springMVC+mybatis)创建一个简单的查询实例(三)(错误整理篇)

    使用ssm(spring+springMVC+mybatis)创建一个简单的查询实例(一) 使用ssm(spring+springMVC+mybatis)创建一个简单的查询实例(二) 以上两篇已经把流 ...

  6. redis特性,使用场景

    redis特性: 1.redis保存在内存中,读写速度快. 2.redis--持久化(断电数据不丢失:对数据的更新将异步保存到磁盘上). 3.redis数据结构丰富 4.redis功能丰富 5.简单( ...

  7. Linux的远程管理

    一.远程管理 与个人用的计算机不同,服务器一般都是运行在IDG机房中,所以我们通常不会直接接触服务器硬件,而是通过各种远程管理方式对服务器进行控制 1.常见远程管理工具方式: -RDP(remote ...

  8. vue-vuex状态管理-1

    export default vuex.Store{ State, //数据库. getters,// 是我们从数据库里取数据的 API,getters 得是一个”纯函数“ actions,//处理数 ...

  9. 使用Stickers拓展集成iMessage简单功能

    添加一个target,选择Stickers拓展: 然后就会出现iMessage的文件夹:添加你需要的iMessage图片,这里图片遵循下面的要求: Small: 100 x 100 pt @3x sc ...

  10. VM for Linux 版本的Bundle格式文件的安装

    VM for Linux 版本的安装步骤: 下面链接下载VM程序包 : https://www.vmware.com/products/workstation-pro/workstation-pro- ...