0

png画像の後ろに黒いバーが必要で、画像の後ろに黒いバーが不透明になっている必要があります。黒いバーに不透明度を適用すると、彼の子要素(png画像)がこの不透明度を継承します。私はこれが起こらないようにしたい。

サイトはwww.tomasfleiderman.com.arで、「お金のために働き、愛のためにデザインする」と書かれています。不透明な黒いバーが欲しいです。

コードは次のとおりです。

<style type="text/css">
p {
font-size:40px;
color: white;
}
#caja
{

}
#fondofrase
{
}
</style>
<!--
<p>Work for money design for love</p>
  -->
<div  id="fondofrase">
<div  id="caja">
<div>
<img src="http://www.tomasfleiderman.com.ar/1.png" alt="Texto" height="60%" width="60%"/>
</div>
</div>
</div>

ありがとう

4

3 に答える 3

2

これは、半透明の背景色で行うことができます:http: //jsfiddle.net/alessandro_pezzato/LWh75/

 background: rgba(0,0,0,0.8);   
于 2012-07-02T16:03:18.447 に答える
1

<div>周囲のタグにこのスタイルを設定してみてください。

background: rgba(0, 0, 0, .5);

ただし、rgbaのブラウザーサポートは完全ではなく、このソリューションを使用する前に必ず検討する必要があります。9未満のIEバージョンでは機能しなくなる傾向があります(リンク:http ://css-tricks.com/rgba-browser-support/を参照)。

于 2012-07-02T16:04:41.597 に答える
1

少なくとも簡単にはできません。子要素の最大不透明度は親と同じであるため、親の不透明度が「0.6」の場合、子画像の不透明度は「0.6」になります。ただし、いくつかの絶対配置手法を使用して、親子要素ではなく兄弟要素としてとを重ね合わdivせることができます。img

<style>
    #positioner {
        position: relative;
    }

    #theText,
    #theImage {
        position: absolute;
        top: 0;
        left: 0;
    }
</style>
<div id="positioner">
    <p id="theText">Work for money design for love</p>
    <img id="theImage" />
</div>
​
于 2012-07-02T16:00:46.623 に答える