背景画像の不透明度を変更する

私は3つのhtmlページからなる国でプロジェクトを行っていますが、各ページの背景画像として国旗のイメージを置くことに決めました。背景画像の不透明度を変更する

私は背景画像の不透明度を変更したいのですが、私は試してみて、それを行うたびに、それはページの他のすべてのコンテンツの不透明度を変更する - テキスト、ヘッダ、などなど

私が持っています私のhtmlのコードのこの行：

<body background="flag.jpg">

そして私のCSSで私は様々なことを試みました。私は、そのタグを旗のような「ID」を与える試み、次に試みた：

#flag { 
     opacity: 0.2; 
}

Iはまた、ちょうど「バックグラウンド」を使用して代わりの「ID」を使用して試みました。

私はしばらくそれを理解しようとしてきましたが、それを手に入れることはできません。アドバイスをいただければ幸いです！おかげさまで

出典

2017-02-24 Conor

https://css-tricks.com/snippets/css/transparent-background-images/を –

は例旗あなたはこのような不透明度を使用することはできません

#flag { 
    background-image: url("flag.jpg"); 
    background-position: top center; 
    background-repeat:no-repeat; 
    opacity: 0.2; 
    position:absolute; 
    width:100%; 
    height:100%; 
}

出典

2017-02-24 15:19:58 TriForce

を試してみました。ありがとうございます。タグはdivタグの間に入りますか？ – Conor

bodyはメインのhtml/websiteタグで、スタイルを適用することはできますが、個人的には身体に触れることはありません。（不透明度、幅、高さ、フォントスタイルなど...）、すべてが – TriForce

と

<body> 
    <div id="flag"></div> 
</body>

とスタイルのために、「背景」になります#flagで別のelementiを追加します。

一つソリューションは、このような背景グラデーションを使用することです：あなたが道ことを行うことができないよう

background: linear-gradient(rgba(93, 41, 28, 0.8), rgba(93, 41, 28, 0.8)), url(https://images.pexels.com/photos/31044/pexels-photo-31044.jpg) fixed;

出典

2017-02-24 15:25:13 thevangelist

内の要素に継承されますので、非常に有用なので、透明な背景色を設定することはできません...と別のものは、体に不透明度を設定すると、内部のすべてがその不透明度を持つことになります... – TriForce

背景画像の不透明度を変更する

答えて

関連する問題