不显示背景图像的元素

我正在尝试为“a”元素添加背景图像，但它只会显示图像的一部分（因此，如果我将 Home 作为值，则无论 home 占用的空间是什么，这就是图像的显示内容，如果该值是空它不会显示图像的任何内容）。

尽管我已经设置了要显示的“a”元素的宽度和高度。

有谁能够帮助我？

Code.

<div style="width:1200px;height:25px;text-align:left;">
<a href="#" style="background-image:url('Images2/Heading/TopMenu.gif');width:176px;height:25px;margin-left:8px;margin-right:8px;">&#160;</a>
<a href="#" style="background-image:url('Images2/Heading/TopMenu.gif');width:176px;height:25px;margin-left:8px;margin-right:8px;">&#160;</a>
<a href="#" style="background-image:url('Images2/Heading/TopMenu.gif');width:176px;height:25px;margin-left:8px;margin-right:8px;">&#160;</a>
<a href="#" style="background-image:url('Images2/Heading/TopMenu.gif');width:176px;height:25px;margin-left:8px;margin-right:8px;">&#160;</a>
<a href="#" style="background-image:url('Images2/Heading/TopMenu.gif');width:176px;height:25px;margin-left:8px;margin-right:8px;">&#160;</a>
</div>

我确信这是愚蠢的事情，但我无法找出是什么。

<a>是一个内联元素。内联元素不能具有设定的宽度和高度。

因此，您需要使用 CSS 属性更改元素的显示模式display.

Use display: block;如果您希望将元素从文本流中取出并视为一个块（即：垂直堆叠，每行一个块）。

Use display: inline-block;如果您希望元素的行为类似于内联元素位置，但具有类似块的属性。

Note: inline-blockIE6 支持<a>。在IE6中，inline-block显示样式仅在具有inline默认样式。