-1

ここで説明するテキストの最後に、テキストの最後の行が徐々に透明になり、それがどのように行われるのか興味があります。

この件については議論がありましたが、jsFiddleが想定どおりに機能せず、他の多くの返信がOPの意図を見逃しているようです。

それは実行可能ですか？もしそうなら、それはベンダープレフィックスなしで実行可能ですか？

4

2 に答える 2

1

彼らはCSS3の背景グラデーションを使用してそれを行っていますが、画像を使用して同じ効果を達成することができます。ほんの少しのpng画像があなたを整理します。

于 2012-07-28T13:12:27.400 に答える
1

はい、できます。ベンダープレフィックスなしで：divテキスト領域の上にaを配置します。これdiv class="fadeout">には、白が増加するグラデーションがあり、その画像の上部が透明で、下部が白（またはページの背景色）のみである画像を配置します。下にあるテキスト領域のテキストは、フェードアウトしたように見えます。

画像はCSS-Gradientに置き換えることができます：

.fadeout {
    background-image: 
      -moz-linear-gradient(center top , rgba(255, 255, 255, 0) 20%, #FFFFFF 95%);
}

ただし、これにはベンダー固有のプレフィックスがあります。

于 2012-07-28T13:14:28.027 に答える