要素でフェーディングの不透明度を達成する方法は？

Question

私の質問は少し曖昧ですが、私にdownvoteする前に、私に説明させてください：

現在、私は自分のcoverflow_sliderを学んでいます。その228行の長さとかなりうまく動作し、現在私はそれを少し良いデザインに取り組んでいます。現在、そのはこのように見ている：このここ

ボタンのための私の.cssです：

.left, .right { 
    position: absolute; 
    z-index: 20; 
    background-color: #000; 
    height: 100%; 
    width: 30px; 
    opacity: 0.5; 

    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
} 

だから今、あなたは両側に2本のグレーのストライプを参照してください？これらは左右のボタンです。今私は彼らがある種の移行をしたいと思う。それは次のようになります。

要求は、おそらく非常に簡単です、私はちょうど私がそれを見つけるためにGoogleに入力すべきかを知りません。 Imもっと多くのPHP開発者と、このすべてのデザインに関与していない。私はこのスレッドがdownvotesのためにおそらく50の評判を要することを知っているが、私は答えを得る価値があると思う。

Answer 1

CSS3バックグラウンドグラデーションを使用できます。 CSS3のバックグラウンドジェネレータはオンラインでたくさんあります。 http://www.colorzilla.com/gradient-editor/。一部のパラメータ（水平、＃999999〜＃FFFFFFなど）でパンチングすると、次のようになります。

background: #999999; 
background: -moz-linear-gradient(left, #999999 0%, #ffffff 100%); 
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#999999), color-stop(100%,#ffffff)); 
background: -webkit-linear-gradient(left, #999999 0%,#ffffff 100%); 
background: -o-linear-gradient(left, #999999 0%,#ffffff 100%); 
background: -ms-linear-gradient(left, #999999 0%,#ffffff 100%); 
background: linear-gradient(to right, #999999 0%,#ffffff 100%); 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#999999', endColorstr='#ffffff', GradientType=1);