Question

我正在使用<li>的背景图片作为按钮，但它没有完整显示;但是，当写文本然后显示。我不想写文本它已经打印在背景图像上。我无法设置宽度 - 我该如何解决这个问题？

#footernav li#footerlocation
{
    display: inline;
    padding-right: 20px;
    background-image: url(../images/ourlocation.jpg);
    background-repeat: no-repeat;
    background-position: 0 -.2em;
}

Answer 1

您的问题是将显示设置为内联。如果您需要背景和宽度，但还需要内联类型列表，请设置float：left。

Answer 2

看看下面的例子：

   ul#footernav li { 
        display:inline; 
        }
    ul#footernav li a{ 
        display:block; 
        width:155px;
        text-indent:-9999px;
        }
    ul#footernav li.footerlocation a{ 
        height:30px ; 
        background: url('images/image.jpg') bottom left no-repeat; 
        }
    ul#footernav li.footerlocation a:hover{ 
        height:30px ; 
        background: url(images/image.jpg) top left no-repeat; 
        }

Answer 3

是的我有同样的问题，我刚刚删除了css样式display: inline并添加display: list-item; float:left;我的问题已解决，希望这会有所帮助。

谢谢，Sankar B

Answer 4

设置图像的宽度和高度

Answer 5

可能对此有所帮助

.tab-content ul li{display: block;padding-left: 30px;background-image:url('images/blue-icon.png');background-repeat: no-repeat;background-position: 0 2px;margin-bottom: 10px;}

Answer 6

我们可以简单地添加以下css规则：

ul.check-list{  
    list-style-image: url(images/tick.jpg);
}

使用背景图像为李

6 个答案: