ASP.NET中路径~/与../的区别及相对路径引入样式不生效问题

核心差异本质 #

两种写法分别属于ASP.NET服务端解析路径和客户端浏览器解析路径，逻辑完全不同：

• ~/开头的路径是ASP.NET专属的应用程序根路径标识符
  仅会被ASP.NET服务端运行时解析，解析规则是直接锚定当前web应用的根目录，和当前页面/母版页的存储位置、访问页面的URL层级都没有关系。比如你的应用部署在域名根目录下，~/Content/Master.css最终会被服务端转换为/Content/Master.css输出给浏览器；如果应用部署在子站点/mysite/下，会自动转换为/mysite/Content/Master.css，适配性极强。
  注意：如果是在普通HTML标签中使用该写法，需要给标签添加runat="server"属性才会触发服务端解析。
• ../../开头的是客户端相对路径
  不会经过ASP.NET服务端处理，直接原样输出给浏览器解析，计算基准是当前用户访问的页面的URL路径，和母版页的存储路径无关。举个例子：母版页存放在/Views/Shared/目录下，你用../../是从母版页的存储路径往上跳两级找Content文件夹，但如果用户访问的内容页存放在/Views/Admin/Setting/目录下，浏览器就会从/Views/Admin/Setting/的层级往上跳两级，最终拼接出/Views/Content/Master.css的错误路径，自然加载不到样式。

两种写法的代码验证 #

你提供的两种写法生效/失效的原因也和上述逻辑一致：

1. 第一种写法（生效）

<link href="~/Content/Master.css" rel="stylesheet" type="text/css" />

该路径经过服务端解析后生成的是从应用根目录出发的绝对路径，不管内容页放在哪个子层级都能正确定位到样式文件。
2. 第二种写法（失效）

<link href="../../Content/Master.css" rel="stylesheet" type="text/css" />

路径计算基准随访问的页面URL变化，只要内容页和母版页的存储层级不一致，就会出现路径错误。

内容的提问来源于stack exchange，提问作者PureWare -Legends Of Gaming