2011-03-31 65 views
3

我正在尝试在Wordpress中使用Thesis主题,它几乎是完美的。对于导航菜单,我想使用图像而不是文字。我的解决方案是通过CSS设置背景图像:在IE浏览器中显示CSS背景图片的文字,而不是FF

ul.menu .tab-2 a {background:url(images/myimage.jpg) no-repeat;background-color:transparent;width:81px;height:60px;margin:0px;padding:6px;border-style:none;} 

这工作正常,但除了IE。你只看到的图像与不是论文是写出来的是导航项目的文本:

<li class="tab tab-2"><a href="http://www.mysite.com/about" title="About Us">About Us<!--[if gte IE 7]><!--></a><!--<![endif]--> 
<!--[if lte IE 6]><table><tr><td><![endif]--> 

在IE浏览器,但是,在href文本并显示在背景图像。我想这是我预期会发生的事情,所以我惊喜地发现,在其他任何浏览器中都不会这样工作。

我想弄明白的是,如果有一种方法可以让背景图像显示在href文本的顶部,有效地将其弄脏。我试图通过黑客论文来禁止写出文本,该文本在除了一个之外的所有菜单项中都有效,这是因为我正在写出类别,而不是页面。

我真的想使用Thesis的导航菜单,而不是自己推出,因为我确信我会有更多的麻烦让下拉在所有浏览器中看起来不错,而我的CSS只是没有那么先进。我不认为有一种方法可以让论文在导航菜单项中使用图像而不是文本。

我一直在盯着这几个小时,显然没有清楚地想清楚它了。

回答

2

尝试增加:

display:block; 
text-indent:-5000em; 
overflow:hidden; 

...您当前的规则。

一些民间人士更喜欢其他方式来做图像替换,但这是IMO最常见的方式。

+0

辉煌,谢谢!我不得不调整下降的样式,使他们仍然显示,但这是完美的! – Michaela 2011-03-31 17:23:29

相关问题