1. ホーム
  2. html

[解決済み] CSSで背景を暗くするには?

2022-07-25 23:07:21

質問

テキストを含む要素を持っています。私は不透明度を減少させるたびに、私は全体のボディの不透明度を減少させる。私はちょうど私が作ることができる方法はありますか? background-image を暗くするだけで、他のすべてを暗くしない方法はありますか?

background-image:url('http://fc02.deviantart.net/fs71/i/2011/274/6/f/ocean__sky__stars__and_you_by_muddymelly-d4bg1ub.png');

どのように解決するのですか?

画像のCSSに次のコードを追加するだけです。

 body{
 background:
        /* top, transparent black, faked with gradient */ 
        linear-gradient(
          rgba(0, 0, 0, 0.7), 
          rgba(0, 0, 0, 0.7)
        ),
        /* bottom, image */
        url(https://images.unsplash.com/photo-1614030424754-24d0eebd46b2);
    }

参考 linear-gradient() - CSS | MDN

UPDATE: すべてのブラウザがRGBaをサポートしているわけではないので、「予備色」を用意しておくとよいでしょう。この色は、ほとんどの場合、ソリッド(完全に不透明な)色になります。 background:rgb(96, 96, 96) . 参考までに ブログ を参照してください。