备用样式表无法在Chrome中使用

时间:2015-04-24 19:13:10

标签: css google-chrome

我需要一些帮助来诊断Chrome中的CSS问题。我甚至不确定如何诊断这个问题。我只是想知道下一步应该是什么。

就解决方案而言,我已经检查过this question,但不是很清楚。我也试过this solution(禁用所有样式,然后启用一个),但它不起作用。我认为this question不适用,因为我们不会从外部域名中提取,因此这不是跨域问题。

问题:

Chrome似乎忽略了我们的备用样式表定义。在我们的应用程序中,我们使用备用样式表和Javascript例程来更改背景颜色。此代码正在运行,并且在Firefox和IE中仍在运行,但在某些时候它已停止在Chrome中运行。样式表的定义如下:

    <link type="text/css" rel="stylesheet" title="white" property="stylesheet" href="/myapp/css/layer.css" />
    <link type="text/css" rel="alternate stylesheet" title="silver" property="stylesheet" href="/myapp/css/medium.css" />
    <link type="text/css" rel="alternate stylesheet" title="grey" property="stylesheet" href="/myapp/css/dark.css" />
    <link type="text/css" rel="alternate stylesheet" title="beige" property="stylesheet" href="/myapp/css/beige.css" />
    <link type="text/css" rel="alternate stylesheet" title="green" property="stylesheet" href="/myapp/css/green.css" />

这里的原始身体定义:

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #282828;
    height: 100%;
    background: #fff url(../images/header-bg.jpg) center top no-repeat;
    min-width: 1024px;
}

应该被替换为(例如)替代样式表中的一个:

body {
    background: url("../images/header-bg-dark.jpg") no-repeat center top #919194;
}

但这不适用于Chrome。我尝试了以下内容:

1)追踪JS代码并验证CSS表是否正确启用/禁用:

        if (document.styleSheets.item(i).href.indexOf("medium") > -1) {
            document.styleSheets.item(i).disabled = false;
        } else if (document.styleSheets.item(i).href.indexOf("dark") > -1
                || document.styleSheets.item(i).href.indexOf("beige") > -1
                || document.styleSheets.item(i).href.indexOf("green") > -1) {
            document.styleSheets.item(i).disabled = true;
        }

2)查看计算出的样式,只显示基本样式 - 就像Chrome忽略其他样式一样。

3)尝试从定义的alternate部分删除rel="alternate stylesheet"

4)尝试从基本定义(layer.css)中删除title

有没有其他想法?如果我找到解决方案,我会发布它。

0 个答案:

没有答案