用于sIFR菜单的CSS选择器

我已经使用sIFR成功实现了简单的应用程序，例如标题，我试图同时使用两种不同的字体 - 一个用于标题，另一个用于菜单。
标题起作用，但不是菜单。我正在使用Tofurious Wordpress主题。这是主题的样式表的管辖菜单字体和链接样式的部分：用于sIFR菜单的CSS选择器

/*MENU COLORS****************/ 
#menu { 
background:#bc7d90; 
} 

#menu li a { 
font:11px Arial, Helvetica, sans-serif; /*MENU FONT STYLES*/ 
text-transform: uppercase; 
color:#fff; /*MENU FONT COLOR*/ 
} 

#menu li a:hover { 
color:#ecd1d9; /*MENU FONT COLOR WHEN HOVERING*/ 
}

我进入#menu li a为Item To Replace的sIFR的设置页面上，然后用这个代码：

.sIFR-root { font-size:15px; font-weight:normal; color:#fff; } 
a { text-decoration:none; color:#fff; } 
a:hover { color:#fff; }

字体出现 - 但不符合上面指定的任何样式，并以意外的方式出现在博客上。你可以在这个地址看到这个例子：www.laurenparkinson.com/blog

此外，实际的子菜单项目根本没有出现。

来源

2010-01-28 Kara

http://doctype.com/是姊妹网站StackOverflow的，但是关于HTML，CSS等。 – 2010-01-29 09:47:51

您可以通过彻底抛弃sIFR来使用@ font-face来支持所有主流浏览器，包括IE版本4（更多兼容性信息：http://webfonts.info/wiki/[email protected]_browser_support）。


@font-face { 
font-family: myFont1; 
src: url('myFont1.eot'); /*For IE*/ 
src: local('myFont1'), url('myFont1.ttf') format('truetype'); 
} 
@font-face { 
font-family: myFont2; 
src: url('myFont2.eot'); /*For IE*/ 
src: local('myFont2'), url('myFont2.ttf') format('truetype'); 
} 

#header{ 
font-family: myFont1, Georgia, Times New Roman, Serif; 
} 

#menu { 
font-family: myFont2, Verdana, Arial, Sans-serif; 
}

只要确保您的字体已授权嵌入。

在线EOT转换器：http://www.kirsle.net/wizards/ttf2eot.cgi

来源

2010-01-29 09:45:09 emmychan

用于sIFR菜单的CSS选择器

回答

相关问题