我知道是多余的，但是 IE 6/7 中的 sIFR 问题

Question

我保证，我已经阅读了数百篇 Joyent 帖子和 stackoverflow 问题，并且我会在开头说，我确信我没有放错地方的逗号，并且安装了 Flash，并且已经让其他人在 IE 中尝试过该页面。

问题是 IE 6/7 中没有任何渲染，但 IE8、FF 和 Safari 都很好。 代码如下：

//sIFR-config.js

var zapfino = { src: '/fonts/zapfino.swf' };

sIFR.fitExactly = true;
sIFR.useStyleCheck = true;
sIFR.useDomLoaded = true;

sIFR.activate(zapfino);

sIFR.replace(zapfino, {
  selector: 'h1, h2, h3, h4'
  ,css: '.sIFR-root { color: #1A2F35; }'
  ,forceSingleLine: true
  ,tuneWidth: 5
  ,wmode: 'transparent'
  ,filters: {
      DropShadow: {
        knockout: false
        ,distance: 3
        ,color: '#330000'
        ,strength: 1
        ,alpha: .45
      }
    }
  ,ratios: [7, 3.59, 9, 3.56, 10, 3.49, 12, 3.5, 13, 3.46, 20, 3.47, 23, 3.43, 26, 3.44, 34, 3.42, 40, 3.41, 42, 3.4, 45, 3.41, 47, 3.4, 49, 3.41, 69, 3.4, 71, 3.39, 72, 3.4, 76, 3.39, 77, 3.4, 3.39]  
});

/* sIFR.css */
@media screen {
    .sIFR-active h1, .sIFR-active h2, .sIFR-active h3, .sIFR-active h4 {
        visibility: hidden;
        font-family: Verdana;
        line-height: 1em;
        color: #ff0000;
    }
    .sIFR-dummy { 
        width: 0px;
        height: 0px;
        margin-left: 42px !important;
        z-index: 0;
    }    
}

<!-- HTML Snippet -->
<div id="header">
    <H1>H1 Example</H1>
    <h3>H3 Example</h3>
    <h2>H2 Example</h2>
    <h4>H4 Example</h4>
</div>

请注意，您看到的几乎每个选项我都尝试过，有或没有，缓存清除等。此外，主 css 绝对将 h1-4 放置在 div#header 中，我也尝试过对其进行注释。

编辑：请注意，.sIFR-active 类应用于 ，因此我知道脚本正在触发，但除此之外页面上的任何内容都没有改变。

我也尝试过不同来源的不同字体，但在 IE 中仍然没有成功。

杰伊·

蒂亚

Answer 1

有时在 IE6/7 中，当绝对值位于浮点数旁边时，绝对值会消失。

在你的CSS中，你有.1header向左浮动，紧随其后的.header_text是绝对定位的。

尝试将 .header_text 设置为position:relative。 或者在 .1header 和 .header_text 之间放置一个空 div。 或者将 div .header_text 包装在另一个 div 中。

顺便说一句 - CSS 类名称必须以下划线 (_)、破折号 (-) 或字母 (az) 开头。 以数字开头的类名是无效的，但我不知道在这种情况下它对 IE 是否有影响。

在评论后添加

我很确定它是一个CSS问题。 删除 #header_text 中带有 sifr 的

...

。 添加

测试

。 在 CSS 中，添加“背景颜色：#00c;” 在#header_text 上。

在火狐浏览器里看一下。 您应该在蓝色背景上看到红色测试。 看看IE，你不会。

在#header_text 上将position:absolute 更改为position:relative。 在 IE 中查看，蓝色背景的红色测试应该显示（不是您想要的位置，但这是另一个问题）。