下の画像のように上下のグラデーションの色を設定するにはどうすればいいですか？

-8

上部と下部に不透明度のあるグラデーションがあります

2016-09-23 Ismet

確かに何か試した/これを研究しました。あなたは何を見つけましたか？なぜあなたのためにこれはうまくいかなかったのですか？ – PeeHaa

少なくともこれを自分でコード化しようとしています。スタックオーバーフローはコードを書くサービスではありません。私はいくつか[**追加の研究**]を行うことをお勧めします（http://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-expected-of-stack-overflow-users） Googleを介して、またはSOを検索して、試みてください。それでも問題が解決しない場合は、**あなたのコード**に戻って、あなたが試したこととそれがうまくいかなかった理由を説明してください。 –

-1

あり、これを取得するための複数の方法がありますが、ここでは擬似要素と一つだ：JSfiddle上

ビュー。

body {padding: 0; margin: 0;} 
 

 
.imgholder { 
 
    position: relative; 
 
    display: inline-block; 
 
    line-height: 0; 
 
} 
 

 
.imgholder::before { 
 
    content: ""; 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    width: 100%; 
 
    height: 100%; 
 
    pointer-events: none; 
 
    background: linear-gradient(rgba(40, 40, 40, 0.5), transparent 25%); 
 
} 
 

 
.imgholder::after { 
 
    content: ""; 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    width: 100%; 
 
    height: 100%; 
 
    pointer-events: none; 
 
    background: linear-gradient(0deg, rgba(40, 40, 40, 0.5), transparent 25%); 
 
}

<div class="imgholder"> 
 
<img src="http://www.greenleafown.tv/wp-content/themes/15zine/library/images/placeholders/placeholder-360x240.png" width="360" height="240"> 
 
</div>

出典

2016-09-23 09:42:21 pol

-1

私はそれを行う方法を知っていますが、= D 私を払っていないので、あなたは自由のための応答が、そこにポストする前にGoogleに尋ねたいです。

http://www.colorzilla.com/gradient-editor/

乾杯：ちょうど "CSSのgardientジェネレータ" を検索する最初のGoogleの結果にこれを見つけました！

出典

2016-09-23 09:42:59 JoelBonetR

下の画像のように上下のグラデーションの色を設定するにはどうすればいいですか？

答えて

関連する問題