ここでそれが行われているのを見ることができますhttp://qunitjs.com/そしてここで分解されますhttp://jsfiddle.net/xMwT8/8/*edit（http://jsfiddle.net/xMwT8/9/）
リンクが利用可能です
画像を上にオーバーレイカラーのテクスチャとして使用するか、画像と組み合わせて微妙なテクスチャにブレンドしようとしています。それはグラデーションで行うことができます（私が投稿した最初と2番目のリンクのように）。色だけでは動かない理由がわかりません（2番目のリンク）。
のような単色ではどうしてできないのかとおっしゃっていると思います#E4E2D6。簡単な説明はそれが無地だということです:)
jsfiddleの例では、単色rgba(255, 0, 0, 0.3)ではなく、70％透明な赤です（a == 0.3つまり、不透明度が30％しかないことを意味します） 。
のようなものでそれを行いたい場合は#E4E2D6、白でRGBをRGBAにrgba(87, 74, 0, 0.16)変換し、同じ色（白で表示されている場合はほとんど透明です）に変換し、背景が透けて見えるようにします。
さて、/9フィドルを見てください（FYIは、そのような編集を行う代わりに、元のリンクを変更することができます）。これはうまくいかないようです
background: rgba( ... ), url( ... );
なんで？複数の背景画像しか持てないためです。ブラウザに関する限り、これは画像であるため、両方を使用し ます-webkit-linear-gradient 。rgba( ... )それがない場合は色なので、画像と色をフォールバックとして使用します