0

私はクライアント向けの Web サイトの開発の最終段階にあり、小さな花の画像がその親要素の透明度を継承しないようにする方法を理解するのに非常に苦労しています。

CSSで絶対配置を使用して、最初に画像を独立させてみました。これはうまくいきました。ただし、ブラウザー ウィンドウのサイズとモニターのサイズ、およびオペレーティング システムによっては、位置合わせの問題が発生しました。ブラウザー選択 JavaScript を追加し、各ブラウザーをチェックするために必要な css コードを追加することで、ブラウザーの問題を (ある程度) 解消することができましたが、ブラウザー ウィンドウのサイズとモニター画面。

独立したフローティング（花の画像）のあるページを表示するには、次の URL を参照してください。

mauisunsetb122.com/index5.html

次に、ブラウザ ウィンドウやモニターのサイズに関係なく、画像が常にテキストに固定されるように、画像を隣接するテキストに関連付けることにしました。ここで透明性の問題が発生しました。この例を見るには、次の URL を参照してください。

mauisunsetb122.com/index5_8.html

次の URL にある例に従って問題を解決しようとしましたが、うまくいきませんでした。

http://blog.ninanet.com/2010/04/27/css-transparency-inheritance-hack

ご協力いただきありがとうございます。

4

1 に答える 1

0

背景を透明にし、子要素にこれを継承させたくない場合は、いくつかのオプションがあります。

  1. 背景画像として透過性の小さい PNG を使用します。
  2. rgba 'background-color: rgba(255,255,255,0.5);' を使用して背景色を設定します。
  3. 恐ろしいCSSハックを使用する

一般 1 が最も使用され、サポートされているようです。

于 2012-12-20T06:43:52.687 に答える