我有一个问题,背景图像没有显示.
<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;好吗?
解决方法
< 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: