1

のdiv要素がありopacity: 0.7;ます。その中のすべてのテキストを不透明にしたいので、これを設定しました。この中divにいくつかの画像も表示したいのですが、これらの画像の不透明度を0.7ではなく100％にしたいのです。画像に設定opacity: 1;してみましたが、どうしても不透明になります。

どうすればこの問題を解決できますか？探し回ったのですが、解決策が見つかりませんでした。

ありがとう

4

5 に答える 5

2

透明度 (< 1) を持つ要素の子は、opacityその親よりも透明度を低くすることはできません。opacity: 1そのため、子要素をその親と同じように透明にするだけの効果がありますが、それ以上はそうではありません。

部分的に透明なテキストを作成するには、代わりに次を使用できます。

div {
    color: rgba(0,0,0,0.7);
}

JS フィドルのデモ。

プロパティをサポートする同じブラウザーでサポートされていると思いopacityます。

于 2012-09-03T10:31:35.123 に答える
2

rgba(0,0,0,0.7);CSS で背景とテキストの色に色の値を使用できます。

div
{
    background: rgba(100,12,100,0.7);
    color: rgba(0,0,0,0.7);
}​

ここで#hex カラー コードを rgb に変換できます。

http://jsfiddle.net/Kyle_Sevenoaks/FQKXv/

IEの場合

彼らのfilterコードを使用できます：

div 
{ 
       background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#55992200,endColorstr=#55992200); 
       zoom: 1;
}

16 進値は 6 桁ではなく 8 桁です。最後の 2 桁はアルファ値です。好みに合わせて調整してください。

于 2012-09-03T10:32:01.923 に答える
1

そのためにRGBAコードを使用してください。これはcss3プロパティであり、ie7、ie8などの古いブラウザはサポートしていません

R= red
G= green
B= blue
A= alpha

div {
   background: rgba(200, 54, 54, 0.5); 
}
于 2012-09-03T10:34:13.400 に答える
0

こんにちは、親コンテナの背景の不透明度を増減でき、子コンテナには影響しないプロパティについて言及しています。cssを見るのは簡単です。基本的に、不透明度のために背景とアルファにRGBカラーを使用する必要があります。

CSS background:rgba(0,0,0,0.1);

またはデモを参照してください:- http://jsfiddle.net/8LFLd/102/

于 2012-09-03T11:06:42.557 に答える
0

何十もの質問を通して何百回も言ったように：

.transparent {
    /* Fallback for web browsers that doesn't support RGBa */
    background: rgb(0, 0, 0);
    /* RGBa with 0.6 opacity */
    background: rgba(0, 0, 0, 0.7);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#70000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#70000000, endColorstr=#99000000)";
}

これがクロスブラウザ ソリューションです。

于 2012-09-03T11:31:16.880 に答える