sIFR将一个单词分成两行？

Question

有没有人对此有任何解释？我尝试在#menu_wrapper ul li上设置宽度无效。

Answer 1

sIFR计算您要应用它的元素的尺寸。浮动元素是收缩包装的，只占用文本内部所需的宽度。

我建议你给每个lis提供一个id，比如

li#nav-blog { width:200px; }

这样可以更好地控制每个导航列表元素占用的区域，以及更多的空间供sIFR使用。

Answer 2

sIFR的宽度限制为您要替换的元素的宽度。如果此元素浮动，则宽度是HTML文本的实际宽度。如果Flash字体比HTML字体宽，则意味着Flash文本将不适合允许的宽度并分成多行。

可能的解决方案：

• 为列表项指定letter-spacing，以使HTML文本与Flash文本一样宽
• 将forceSingleLine的{​​{1}}参数设置为sIFR.replace()，其缺点是Flash影片在初始化时会显示水平调整大小
• 结合使用这两种解决方案以获得更好的初始化性能，以及文本永远不会分裂的安全性

Answer 3

我的解决方案：

sIFR.replace(gothic, {
   wmode: 'transparent',
   forceSingleLine: true,
   selector: '.quick-access li h2 a',
   css: [
        '.sIFR-root { background-color: transparent; font-size:24px;  color: #abaaab; text-align: center; cursor: pointer;}',
        'a {background-color: transparent; font-size:24px;  color: #abaaab; text-decoration:none; text-align: center; cursor: pointer;}',
        'a:hover {background-color: transparent; font-size:24px;  color: #77b100; text-decoration:none; text-align: center; cursor: pointer;}'
        ],
});

和CSS：

h2 {
    font-size: 18px;
    font-weight: normal;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 1.35;
    margin: 0 0 5px;
}

*{
    margin: 0;
    padding: 0;
}