内容网址在Firefox浏览器上不显示图像

Question

.googlePic{    content: url('../../img/googlePlusIcon.PNG');    margin-top: -6.5%;    padding-right: 53px;    float:right;    height: 19px;}这是googlePic我css文件中班级的一个示例。它可以工作并在google chrome和上很好地打印出来safari。但是，它对无效firefox。Nth被打印出来。请帮忙 ：）

Answer 1

我知道这可能是一个较晚的响应，但是我遇到了同样的问题。

我查了一下，以某种方式指出网址不是有效的“内容”类型，甚至Chrome和Safari都是好人，并且很好地展示了它。

对我有用的是创建一个空的“内容”并使用背景显示图像：它在Chrome，Firefox，Safari和IE8 + 9中很好地工作

.googlePic:before {

    content: '';

    background: url('../../img/googlePlusIcon.PNG');

    margin-top: -6.5%;

    padding-right: 53px;

    float:right;

    height: 19px;

}

编辑：忘记在类名后放置：before

Answer 2

您必须编写两个样式的CSS类

.googlePic

{  /*this for crome browser*/

    content: url('../../img/googlePlusIcon.PNG');

    margin-top: -6.5%;

    padding-right: 53px;

    float:right;

    height: 19px;

}

.googlePic: after

{  /*this for firefox browser*/

    content: url('../../img/googlePlusIcon.PNG');

    margin-top: -6.5%;

    padding-right: 53px;

    float:right;

    height: 19px;

}

及其对我的工作:)