html – CSS背景图片问题(图片未显示)

我有一个问题,背景图像没有显示.

我有一个我已添加到锚标签的课程.

<a class="my-class"></a>

并且该课程的CSS是：

.my-class {
    background:transparent url("../images/my-bg-image.png") no-repeat 0 center
 }

问题是背景图像没有显示.

我知道它就在那里,因为当我这样做时：

<a class="my-class">&NBSP;</a>

部分图像显示.

任何人都知道如何使整个图像显示,而无需插入大量的& nbsp;好吗？

解决方法

&LT a取代; tag是内联元素,没有内容将不显示背景,因此您需要将其显示为块或内联块元素,然后定义元素的大小.

试试：

.my-class {
    display:     block;
    width:       128px;
    height:      128px;
    background:  transparent url("../images/my-bg-image.png") no-repeat 0 center
}

有关详细信息,请查看CSS 2.1 w3c standard上的box model和display property.

此外,第The width property和Computing widths and margins节解释了为什么元素不显示空内联元素的背景.

更新：

另外,CSS Box模型的工作草案是W3C网站上的available.

更新2：

另一方面,仅依靠css背景图像获取链接可能会导致somme可访问性问题.

原文地址：https://www.jb51.cc/html/227085.html