2014-03-28 23 views
0

我有以下的HTML ....如何擺脫UL李即6圓點突出

<div id="modern-ticker" class="modern-ticker mt-round"> 
     <div class="mt-label" class="mt-label">NEWS:</div> 
     <div id="mt-news" class="mt-news"> 
      <ul>      
       <li><a class="green" href="#" target="_self">News 1 News 1News 1News </a></li> 
      </ul> 
     </div> 
    </div> 

在Firefox和Chrome我的風格很好看......

enter image description here

但在IE6中,我在子彈點圖像上獲得了一些突出顯示。如果仔細觀察下面的圖像,您會看到綠光圖像背景中有一點藍光。

enter image description here

我只是想知道,如果有人可以幫助我,我如何能擺脫這一點。這裏是我的風格很像...

.mt-news li { 
    margin-left: 0.5em !important; 
    line-height: 18px !important; 
    width: 100%; 
    display:inline-block; 
} 

.mt-news a.green { 
    background-color: #DEDEDE; 
    background-image: url("../images/green.png") !important; 
    color: #505050; 
    padding: 8px 0 0 35px !important; 
    background-position: left top !important; 
} 

感謝

+0

http://css-tricks.com/snippets/css/png-hack-for-ie-6/ – fcalderan

+2

IE6不支持透明圖像。 –

+0

[爲什麼你需要支持IE6?](http://www.modern.ie/ie6countdown)另外,IE6不支持'display:inline-block'。 – Vucko

回答

2

在IE6來修復這個bug,你可以使用AlphaImageLoader濾鏡。

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png', sizingMethod='scale'); 

還有其他方法可以通過一些javascript代碼來解決它。但這似乎是簡單的解決方案。

你也可以使用IE條件語句。

<!--[if gte IE 5]> 
<style type="text/css"> 
    img { 
    background:none; 
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png' ,sizingMethod='scale'); 
    } 
</style> 
<![endif]--> 
+0

感謝您的回覆。我真的很努力讓你的解決方案爲我工作。到目前爲止,我無法擺脫圍繞我形象的醜陋灰色/藍色方塊。去更新我的問題,告訴你我曾經嘗試過... – Richie