列表项目背景锚链接

时间:2012-02-29 11:30:52

标签: html css

我正在研究这个问题:Menu List

我要做的就是自己检查一下,如果我的方法是正确的。该网站正在Wordpress上运行。

理想情况下,我想摆脱“我们的服务,关于我们”等文本。但我也希望图形成为可点击的锚链接。

有没有人对最佳方法有任何想法?

提前致谢。

2 个答案:

答案 0 :(得分:1)

anchor内提供图片。写得像这样:

.menu-header ul li a{
    display:block;
    padding: 70px 55px;
    text-indent:-9999px;
}

#access .menu-header ul li#menu-item-26 a{
    background: url(http://i41.tinypic.com/345h0cw.png) no-repeat;    
}

#access .menu-header ul li#menu-item-24 a{
    background: url(http://i43.tinypic.com/15cikhs.jpg) no-repeat;
}

#access .menu-header ul li#menu-item-23 a{
    background: url(http://i39.tinypic.com/dca82q.png) no-repeat;
}

选中此http://jsfiddle.net/FN6f5/2/

答案 1 :(得分:0)

我会这样做以删除活动链接文本。但是,我建议将每个按钮图像设置为相同的高度,以便您可以以一种很好的方式水平对齐它们。宽度可以改变,但只需相应调整css。

http://jsfiddle.net/FN6f5/3/