Question

我在IE 9，Firefox 21.0上工作正常但在Chrome版本28.0.1500.95上没有。如何在其他浏览器中使用它？

我有以下作为我的HTML和CSS。

 <div class="footer">
    <div class="contact">
    <ul>
        <li ><a href="#">Contact</a></li>
        <li ><a href="#">Site Map</a><div ></div></li>
        <li ><a href="#">Legal</a></li>
        <li ><a href="#">Privacy Statement</a></li>
        <li ><a href="#">Send Feedback</a></li>
    </ul>
    </div>
    <div class="clear"></div>
    <div class="copyright">&copy; 2013 Hygeia Group. All Rights Reserved.</div>
    <!-- <br clear="all"/>-->
    <div class="social">
    <ul>
    <li><a href="#">Tweeter</a><div class="separator"></div></li>
    <li><a href="#">Youtube</a><div class="separator"></div></li>
    <li><a href="#">FaceBook</a><div class="separator"></div></li>
    <li><a href="#">LinkedIn</a><div class="separator"></div></li>
    </ul>
    </div>
</div>

    .footer {
      height:40px;
      font-size:11px;
      bottom:0px;

      }

    .footer  ul{
  margin-left:24.95%;
  list-style:none;
  list-style-type:none;
  list-style-image:none;
  list-style-image:url("../images/separator.png");
  z-index:50000;    
  list-style:none;
      }

      .footer ul li{
   padding:0 5px 0 0px;
   margin-right:15px;
   list-style:none;
   list-style-type:none;
   list-style-image:none;
   float:left;
   list-style-image:url("../images/separator.png");
   text-align: center;

       }

      .footer ul li > a{
   text-decoration:none;
   color:#666;  
   padding:0px 2px; 
       }
      .footer ul li:first-child {
   list-style-image:none
       }

Answer 1

只是fyi：如果你误将.png命名为.jpg（反之亦然），某些浏览器将无法加载它。

当我使用jsfiddle.net进行测试时，我在Chrome 28.0.1500.95中看到它很好。尝试使用该网站创建一个我们都能看到的页面。

我提供了一个我曾经躺着的'分隔符'图像 - 我认为你的.png文件并不奇怪，并且当你直接加载它时它会正确显示？

Chrome无法显示列表样式图片

1 个答案: