在ASP.NET MVC中更新相对位置

时间:2012-07-20 14:47:00

标签: asp.net-mvc-3

我的文件结构如下所示:

/root
  /images
    image1.png
    image2.png
    button1.png
    button2.png
  /css
    app.css
    core.css
  /scripts
    jquery-1.6.4.min.js
    jquery.mobile-1.1.0.min.js
  /path1
    /pathA
      index.cshtml
      page1.cshtml
    index.cshtml
  /path2
    /pathA
      index.cshtml
      page1.cshtml
    /pathB
      index.cshtml
      page1.cshtml
    index.cshtml
  index.cshtml
  _layout.cshtml

所有.cshtml文件都依赖于_layout.cshtml来共享内容。我的_layout.cshtml文件如下所示:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">

    <link rel="stylesheet" href="/css/core.css" />    
    <link rel="stylesheet" href="/css/app.css" />

    <script src="/scripts/jquery-1.6.4.min.js" type="text/javascript"></script> 
    <script src="/scripts/jquery.mobile-1.1.0.min.js" type="text/javascript"></script>

    <style type="text/css">
        #button1 .ui-icon { background: url(/images/button1.png) }
        #button2 .ui-icon { background: url(/images/button2.png)  }     
    </style>

</head>
<body>
    @RenderBody()
</body>
</html>

此文件以“/”开头引用所有网址。不幸的是,当我将我的应用程序移动到PhoneGap时,这不起作用。我希望用相对路径替换所有开头的“/”。例如,如果我访问/path1/pathA/index.cshtml,我希望两个按钮css定义看起来像:

  #button1 .ui-icon { background: url(../../images/button1.png) }
  #button2 .ui-icon { background: url(../../images/button2.png)  }      

有没有办法可以自动更改我的路径,使它们像上面所示的那样相对?我对自己想要的东西有意义吗?

1 个答案:

答案 0 :(得分:3)

我建议您使用内置的html助手,例如:

<script src="@Url.Content("~/Scripts/jquery-1.6.4.min.js")" type="text/javascript"></script>

...

#button1 .ui-icon { background: url(@Url.Content("~/Content/images/button1.png")) }