Divのテキストを完全不透明から不透明にフェードする方法（色なし）

Question

色を含まずにCSSのグラデーションを使用してテキストをフェードインしようとしています。ここで

はここ

...私がやろうとしているものの例であるあなたが私の仕事で私を助けるために使用できるいくつかのソースコードです： https://jsfiddle.net/cwqenuy7/3/

HTML

<div id="fadedDiv"> 
    <p>Hello</p> 
    <p>This</p> 
    <p>Text</p> 
    <p>Should</p> 
    <p>Be</p> 
    <p>Fading</p> 
</div> 

CSS

body { 
    background-image: url('https://pbs.twimg.com/profile_images/664169149002874880/z1fmxo00.jpg'); 
} 

#fadedDiv { 
    width: 140px; 
    height: auto; 
    border: 1px solid red; 
    padding: 0 20px; 
    font-weight: bold; 
} 

#fadedDiv p { 
    margin: 0; 
} 

大変助かりました！それは不透明度のCSSプロパティを使用して達成するために

Answer 1

：

<p style="opacity:1">Hello</p> 
<p style="opacity:0.8">This</p> 
<p style="opacity:0.6">Text</p> 
<p style="opacity:0.5">Should</p> 
<p style="opacity:0.4">Be</p> 
<p style="opacity:0.3">Fading</p> 

あなたの更新JSFiddle