透明なdiv内の非透明div

透明なdivを持つWebページを作成しています。透明なdiv内の非透明div

透明なdiv内に非透明なdivを追加したいと思います。透明でもあることがわかりました。

divの内部を不透明度に設定しようとしました：1しかし、動作しません。

どうすればよいですか？

2009-06-14 Billy

コードのスニペットを表示できますか？ –

私は本当にあなたがこれをする必要があるのが不思議です。 divの背景はデフォルトで透明です。なぜそれをもう一度表示するだけで、すべてのものを透明にするのですか？ –

divをカラーにして不透明度を透明にすると、問題が発生します。このdivにテキストを配置したい場合、テキストは透過的であり、常に望ましいとは限りません。 – NilObject

この問題を回避するために私が知っている2つの方法があります。

2009-06-14 04:47:28 NilObject

まあ、position：relativeの親要素を使用することで、半透明の子要素が、通常配置された非半透明の子要素の背後に配置されるようにすることもできます。これは、外部画像や固定サイズを必要としないという利点があります。 – Shog9

状況に応じて、IE6は透過PNGを単独でサポートしておらず、いくつかの助けが必要です（追加のjavascriptライブラリを使用する必要があります）。 – merkuro

IE6と7は、ビリーが使用しているCSSの不透明度をサポートしていないので（IEのアルファフィルタについては言及していない限り）、ミュートになる可能性があります。 –

これは残念なことにCSSでは機能しません。過去に私は透明なdivにコンテンツを含む非透明divをプッシュする位置を使用しました。私は私のプロジェクトからいくつかの古いコードを掘ることができませんでしたが、私はこのブログの記事を見つけた：

2009-06-14 04:47:43

私はCSS3を研究しながら、このどこかを見つけたので、信用のように私は再呼び出すことができないというところ謝罪します適切な著者。

ただし、divに半透明の背景色を探している場合は、不透明度/アルファプロパティを使用して色を設定し、透明度を制御する代わりに、rgba（rrr、ggg、bbb、aaa）形式を使用してbackground-colorプロパティを直接設定します。これにより、子要素が透明性を継承しないようになります。

ex。

#mydiv { background-color: rgba(128,64,0,0.75); }

2011-07-21 17:54:19 robbie

偉大な答え、これは緑のダニを持っている必要があります。 –

すばらしい解決策！この問題には解決策がないと言っているサイトがたくさんあります。 – DanielX2010

良い残念ながらcss3の色はie9 + – taseenb

背景、パディング、background-originを使用して、要素の位置を制御するためのパディングとZ-インデックスを制御します。例：

#mydiv{ background: white; padding:100px; background-origin:border-box; z-index:1}

2016-02-24 14:25:52

答えて