2016-12-21 5 views
0

テキストに虹の効果があると思っています。私はInternet Explorerを除くすべてのブラウザで動作している次のコードを持っています。これをIEで動作させる方法を知っている人は誰ですか?これはIEの古いバージョンのための背景グラデーションに取り組むが、テキストはありませんCSSグラデーション - Internet Explorerに表示されない

.icon-child-work { 
    color: transparent; 
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0.5,  #f22), color-stop(0.10, #f2f), color-stop(0.20, #22f), color-stop(0.25, #2ff), color-stop(0.30, #128C16),color-stop(0.40, #2f2), color-stop(0.45, #ff2), color-stop(0.55, #f2f)); 
    background-image: gradient(linear, left top, right top, color-stop(0.5, #f22), color-stop(0.10, #f2f), color-stop(0.20, #22f), color-stop(0.25, #2ff), color-stop(0.30, #128C16),color-stop(0.40, #2f2), color-stop(0.45, #ff2), color-stop(0.55, #f2f)); 
    -webkit-background-clip: text; 
    background-clip: text; 
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#1471da, endColorstr=#1C85FB)"; 

    padding-right: 10px; 
} 

答えて

0

background: linear-gradient(to bottom, #feffff 0%,#1471da 50%,#1C85FB 100%); /* Supports IE10+ and several other older browsers */ 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1471da', endColorstr='#1C85FB',GradientType=0); /* Supports IE6-9 */ 

<span class="icon-child-work"> 
    Hello 
</span> 

CSS:ここ

jsFiddle

HTMLです

+0

グラデーションはスパン全体の背景として表示されます。テキストをフィルタリングする必要があります。 –

+0

質問のように見えます。あなたがサポートする必要がある最も古いバージョンは何ですか?私は答えを更新します。 – Adrianopolis

+0

悲しいことにIE9 ..... IE8が可能です。 –

関連する問題