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

前端之家收集整理的这篇文章主要介绍了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 modeldisplay property.

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

更新:

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

更新2:

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

原文链接:https://www.f2er.com/html/227085.html

猜你在找的HTML相关文章