CSS で透明なグラデーション効果を実装するためのサンプルコード

<本文>
    <div class="bg-gradient">
        <div class="pic"></div> 
    </div>
</本文>

<スタイル>
        .bgグラデーション{
            マージン: 0 自動;
            背景: rgb(244, 195, 77);
            位置: 相対的;
            幅: 600ピクセル;
            高さ: 350ピクセル;
        }

        .bg-グラデーション .pic{
            背景画像: linear-gradient(右へ、rgb(244, 195, 77)、透明)、url("bg.jpg");
            背景の位置: 中央;
            背景ブレンドモード: 通常;
            位置: 絶対;
            高さ: 100%;
            幅: 250ピクセル;
            右: 0;
        }
</スタイル>