ホームページ  >  記事  >  ウェブフロントエンド  >  CSSの背景を透明にして文字を不透明にする方法_html/css_WEB-ITnose

CSSの背景を透明にして文字を不透明にする方法_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:50:181911ブラウズ

背景画像を透明にし、テキストを不透明にする方法を見つけてください。さまざまなブラウザとの互換性が最も高くなります。

現在、2つのタイプがわかっています。ブラウザ chrome ie11 をテストします
方法 1 (現時点で最も満足のいくものですが、画像はサポートしていません)
背景:rgba(255,255,255,0.5) !重要;
両方ともサポートされています
方法 2 (div 内のスパン)
div{
filter: alpha(opacity=20);
opacity:0.2;,
}
range{
position:absolute;
}
IE11 はサポートしていますが、Chrome はサポートしていません。 !


ディスカッション(解決策)に返信

背景画像自体を半透明のpng形式にするだけ

作業を分ける必要があります

背景を透明にするレイヤーは1つ
背景を表示するレイヤーは1つtext

次に、2 つのレイヤーが div 内に配置されます

http://leegorous.net/tools/bg-alpha.html
このツールを使用して、互換性のあるコードを生成します。高度なブラウザーはアルファ透明度を使用し、IE はフィルター透明度を使用します。

背景画像そのものを半透明のPNG形式にするだけです


CSSを通じて変更できれば、よりパーソナライズされます。

http://leegroous.net/tools/bg-alpha.html
このツールを使用して、互換性のあるコードを生成します。高度なブラウザーはアルファ透明度を使用し、IE はフィルター透明度を使用します。


背景色だけであれば問題ありません。私が今質問しているのは背景画像です。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。