asp.net - 如何将母版页和CSS应用于子页

Question

我有一个母版页可以应用到我的所有页面，母版页正在执行它的工作，但是，它似乎无法解析我在子文件夹中的页面的 CSS 文件地址。

我有一组这样的文件夹:

RootContent      UsersContent      AdminContent

Since the master page and css files are on the Root content, when the master page tries to locate the css file inside UsersContent or AdminContent it cannot find it.

I'm using JavaScript to detect the browser and set the css properly for most browsers and another file for IE6 since is required in here, any ideas?.

<script type="text/javascript">
    if((BrowserDetect.browser.toString() == "Firefox") && (BrowserDetect.version.toString() == "3.5"))
    {
        document.write('<link rel="Stylesheet" href="<%=ResolveUrl("~/StyleSheet.css") %>" type="text/css" />');
    }
    else if((BrowserDetect.browser.toString() == "Explorer") && (BrowserDetect.version.toString() == "6"))
    {
        document.write('<link rel="Stylesheet" href="~/StylesheetIE6.css" type="text/css" />');
    }
</script>

在上面的代码中，我尝试了 <% ResolveUrl("~/StyleSheet.css") %>但没有用，它在同一个文件夹中有效，但在 child 身上无效。

编辑:只是为了澄清我的 CSS 文件在我的根文件夹中，而不是在子文件夹中

Answer 1

最简单的方法是在您的 Web 元素下添加 App_Themes 文件夹。添加一个主题并在该主题下添加所有 css 文件，包括它们各自的图像目录。

在你的 web.config 中，添加

它会自动添加到每个页面。

注意:- 在这种情况下，将应用所有 css。如果您有特定于浏览器的 css，那么这不是方法。

[SEE UPDATED]

要由 IE 6 而不是其他浏览器加载的“iespecific.css”之类的 CSS 文件，请在网页的 HEAD 部分使用以下代码:

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

同样，对于任何版本的 IE 5(包括 5.0、5.01、5.5 等)，请使用以下内容:

<!--[if IE 5]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

要检测 IE 5.5 的发布版本，您需要以下代码:

<!--[if IE 5.5000]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

例如，要测试大于或等于版本 6 的所有版本的 IE，您可以使用

<!--[if gte IE 6]>
<link rel="stylesheet" type="text/css" href="iespecific.css" />
<![endif]-->

上面的代码示例之所以有效，是因为普通浏览器会将整个 block 视为 HTML 注释，因为它们包含在“”中。然而，IE 5 或更高版本将尝试解析该 block 以查看它是否具有特定于它的指令。

您也可以使用此方法排除某个样式表。例如，要从 IE 6 中排除 CSS 文件“not-ie.css”，请使用:

<![if !(IE 6)]>
<link rel="stylesheet" type="text/css" href="not-ie.css" />
<![endif]>

注意运算符“!”紧接在“IE”之前。这是 NOT 运算符，导致仅当浏览器不匹配表达式“IE 6”时才使用以下语句。

同样，上面的代码之所以有效，是因为普通浏览器会将“”和“<[endif]>”解释为它无法识别的 HTML 标记，并忽略它们。但是，此代码不会在 HTML 验证器中验证为正确，因为它没有使用有效的 HTML 标记。

请注意，您也可以在不指定版本号的情况下测试 IE。例如，以下仅当浏览器不是 IE 5 或更高版本时才加载样式表:

<![if !IE]>
<link rel="stylesheet" type="text/css" href="not-ie.css" />
<![endif]>

可在 http://msdn2.microsoft.com/en-us/library/ms537512.aspx 找到有关此非标准功能的 Microsoft 文档。

由于文档没有指定这些功能仅适用于 Windows 版本的 IE，因此我假设它们也适用于 Macintosh 版本。不过我无法验证这一点。