CSS 背景图片在 IE6 和 IE7 中不一致

Question

我有一个通过 javascript 生成的跨度，其 css 类如下:

.class1{  
  width:25px;
  height:25px;
  background-image: url(pic.png);
  background-repeat:no-repeat;
  background-position: center; 
  cursor:pointer;
  margin-left:10px;
 }  

问题出在 html 页面上，我可以在 IE7 中看到指针光标，但看不到背景图像。

在 IE6 中，两者都显示，没问题。

Answer 1

Span，顾名思义，就是一个内联元素，试试在.class1中加入display:block;或者display:inline-block; .同时添加图像的 height 和 width。

像这样:

.class1{  
  width:25px;
  height:25px;
  background-image: url(pic.png);
  background-repeat:no-repeat;
  background-position: center; 
  cursor:pointer;
  margin-left:10px;

display:block; /*or inline-block*/
height:100px;
width:100px; /*img height and width*/
 }