母版页中引用图片,外部js、css文件的路径问题 [转]

 
  
当嵌套母版页的子页面与母版页不在同一级目录时,往往会牵涉到 外部图片、js、css文件引用的路径问题。(以下是引用别人加自己整理)
1. 图片、
< a > 标签
非常好解决
< img runat ="server" src ="~/images/log.gif" mce_src ="~/images/log.gif" ></ script >
< a href ="~/book/buy.aspx" mce_href ="~/book/buy.aspx" runat ="server" ></ a >
加上runat="server" ,路径使用绝对路径~/基本上就OK了。

2. CSS文件引用
< link rel ="stylesheet" type ="text/css" href ="style.css" mce_href ="style.css" ></ script >
这里神奇的就是link的文件的href是随着被访问文件的目录结构自动调整,说白了就考虑母版页引用的路径就 可以了,其他不用费心。
比如在母版页同目录下的一个文件夹内的一个xxx.aspx引 用的母版页,那么上面的语句在客户端就自动变为
< link rel ="stylesheet" type ="text/css" href ="../style.css" mce_href ="style.css" ></ script >
前提就是
< head runat ="server" ></ head > 必须有runat="server"

3. JS文件的引用
< mce:script type ="text/javascript" src ="menu/jquery.min.js" mce_src ="menu/jquery.min.js" ></ mce:script >
这样的话在其他目录下的页面文件,客户端肯定就引用不到了
那么你需要这样处理
< mce:script type ="text/javascript" src ='<%=ResolveUrl(“menu/jquery.min.js”) % > <!--
'>
//
--> </ mce:script >
< mce:script type ="text/javascript" src ="<%=ResolveClientUrl(“" mce_src ="&lt;%=ResolveClientUrl(“" menu/jquery.min.js”) % > <!--
'>
//
--> </ mce:script >

这是2种方式,在客户端的路径当然也会不一样,分别是:
< mce:script type ="text/javascript" src ="/Example/menu/jquery.min.js" mce_src ="Example/menu/jquery.min.js" ></ mce:script >
< mce:script type ="text/javascript" src ="menu/jquery.min.js" mce_src ="menu/jquery.min.js" ></ mce:script >
那么很明显ResolveClientUrl是相对路径,是比 较好用的,当然ResolveUrl也有很多地方需要这样的绝对路径,其中Example是web应用的名字。
另外,如果不可用请在
< head > 标记中添加:runat="server"
当子页面需要引用自己的css、js外部文件时,可以在母版页 的
< head runat ="server" ></ head > 标记中加添加一个标签
< asp:contentplaceholder runat ="server" id ="HeadContent" >
</ asp:contentplaceholder >
子页面可在此标记中加入自己需要引用的文件
</ asp:Content
<asp:Content ID="Content2" ContentPlaceHolderID="HeadContent" Runat="Server"
>
< link rel ="stylesheet" href ="css/thickbox.css" mce_href ="css/thickbox.css" type ="text/css" />
< link rel ="stylesheet" href ="http://www.cnblogs.com/css/common.css" mce_href ="http://www.cnblogs.com/css/common.css" type ="text/css" />
< mce:script type ="text/javascript" src ="js/jquery-1.4.1.min.js" mce_src ="js/jquery-1.4.1.min.js" ></ mce:script >
本文转自:
http://blog.youkuaiyun.com/liujun198773/archive/2010/09/29/5913882.aspx

转载于:https://www.cnblogs.com/shrimp-liao/archive/2011/05/20/2051745.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值