IE將藍色邊框添加到使用css漸變的div上

我正在嘗試製作灰色線條，即漸變爲透明。我創建了一個div，即1x100px，並添加了css漸變以實現淡化效果。IE將藍色邊框添加到使用css漸變的div上

它工作正常，除了在IE獲得一個藍色的邊框，我不能擺脫。

這是我在div

#left_header_border { 
    position:absolute; 
    bottom:-1px; 
    left:-100px; 
    width:100px; 
    height:1px; 

    /* gradient */ 
    background-color: transparent; 
    background-image: -moz-linear-gradient(left, transparent, #cccccc); /* FF3.6 */ 
    background-image: -o-linear-gradient(left, transparent, #cccccc); /* Opera 11.10+ */ 
    background-image: -webkit-gradient(linear,left bottom,right bottom,color-stop(0, transparent),color-stop(1, #cccccc)); /* Saf4+, Chrome */ 
    background-image: -webkit-linear-gradient(left,transparent, #cccccc); /* Chrome 10+, Saf5.1+ */ 
    background-image: linear-gradient(left, transparent, #cccccc); 
       filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1, startColorStr='transparent', EndColorStr='#cccccc'); /* IE6–IE9 */ 
}

我試圖檢查的股利，並使其較高的CSS和梯度似乎工作，但顏色是藍色的，添加邊框。爲什麼？

來源

2011-03-31 swenedo

更改過濾器：

filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1, startColorStr='#00cccccc', EndColorStr='#ffcccccc'); /* IE6–IE9 */

過濾器不允許「透明」的顏色值，但它確實讓你use an 8-digit hex reference，其中前兩個數字指定顏色的不透明度（就像rgba()顏色參考中的最後一個值）。

More on using RGBA and transparency & using MS Filters

如果可怕的數學有點讓你，你可以找到如0.6 transparency在Windows計算器，在科學的視圖中的示例打開它，就255 * 0.6 = 153然後點擊「HEX」複選框的轉化率= 99

上面它已開始在完全透明（0.0不透明）= 255 * 0 =十六進制值「00」通過到完全不透明（1.0不透明性）= 255 * 1 =十六進制值「ff」

更新作爲麻煩通過評價thirtydot聯的，這裏的一個方便converter from RGBa to MS Filter syntax

來源

2011-03-31 09:19:42 clairesuzy

我正在編輯添加大聲笑 - 感謝找到參考保羅！ – clairesuzy 2011-03-31 09:26:08

@clairesuzy：哎呀！對不起，我確實在那裏跳 - 請隨時重新編輯回自己的風格。 – 2011-03-31 09:30:45

不需要保羅幫忙！我只是添加了計算信息，它花了我一個時間來找到我需要的時間;） – clairesuzy 2011-03-31 09:48:02

我建議使用CSS3Pie而不是硬編碼filter風格這種事情 - 這是更容易和更符合標準;它允許您在較舊版本的IE中使用標準CSS3作爲漸變。

來源

2011-03-31 09:59:41 Spudley

謝謝@Spudley，我會檢查CSS3Pie：） – swenedo 2011-03-31 10:49:35

IE將藍色邊框添加到使用css漸變的div上

回答

相關問題