私の考えは、透明度が0％から100％のいくつかのテキストをオーバーレイするPNGは、すべてCSSの背景と同じ色に着色されているため、それ。同じ色のCSSの背景に透明なPNGを配置する
トランスペアレントなPNGは、トランスペアレントな領域でも表示されます。また、PNGとCSSの色は、同じ16進値で作成しても同じではありません。
画像が含まれています。 Illustrator、Photoshop、Fireworksでリソースを作成しようとしました。私はpngcrush、PNGSquash、ImageMagickでガンマ情報（gAMA）を削除しようとしました。問題はSafariの場合と同じです。
誰かがこれを解決する方法を知っていても、それが可能であれば、私はそれを聞いてみたいです！前もって感謝します。
私はすぐに発生している問題を解決することはできませんが、それはあらゆる使用のだ場合、私は、代替テキスト・フェージングのソリューションを提供することができますか？
.text-to-fade {color: rgba(255,255,255,0.0) /* red: 255, green: 255, blue: 255, alpha: 0 */
}
端における0.0の値は、アルファ値であり、0は透明で不透明であると1で、0から1の範囲とすることができます。 rgbaは私が実験した限りFirefox以外のブラウザでは問題があります。
それは透明なので、おそらく
.text-to-fade {opacity: 0.5; /* for most browsers */
filter: alpha(opacity=50); /* for IE */
}
ありがとう、私はそのCSSについて知りませんでした。しかし、私が正しく理解していれば、これは下の3/4/5 /に異なるアルファ値を何度も繰り返して適用すると、テキスト・フェーディング・エフェクトしか作成できません。テキストの行？ 私が解決しようとしているのは、行の数が動的なコンテンツのために「何か」になる可能性があるため、行を数えるロジックをコーディングせずにテキストをフェードアウトすることです。 – eferm
これらの行にフローティングされた.pngを使用する場合、同じ問題は発生しませんか？私は私の答えを修正してJS/jQueryソリューション（CSS値を修正するために必要）を提供したいと思います。私はあなたの要求に沿ってより良い解決策を見つけることができるかどうか試してみるつもりです。 –
私はどんな提案にもとても満足しています！しかし私はJS/jQueryにあまり慣れていません。しかし、それは学ばない理由はありません:) – eferm
、別の色のように見える理由は、色が実際に異なっているではないので、あります。これを実証するには、レイヤーをサポートするイメージエディタを開きます。白いボトムレイヤーと黒いトップレイヤーを作成します。黒のレイヤーの不透明度を50％に設定し、レイヤーをマージします。カラーピッカーを使用して色を確認します。それは黒ではなく＃808080になるでしょう。
退色していないのは、その色が加法的だからです。テキストが＃808080であるとします。テキストがある場所では＃808080がオーバーレイされ、＃808080がオーバーレイされ、＃424242のようになります。 Webブラウザ内で何をしようとしているのかを1つの手順で行う素晴らしい方法はありません。
JavaScriptを使用してテキストを非表示にする（visibility：hidden;）ことが1つの方法です。
。
ああ...どういうわけか私は理解しています。説明をありがとう！しかし、段落内の特定の単語がどの行にあるのかを感知するコードを実装するように残っているようですが、それは別の問題です。 – eferm
ああ、私は以下のコメントで尋ねることを意図していましたが、あなたのコード（xhtml/css）と可能なリンクをあなたがこれまでに得たものを示すライブデモに投稿できますか？ –