是否可以使用CSS像這個圖像一樣動畫？

Question

只是一個簡單的問題。我只想使用CSS/Html5製作一個簡單的動畫，最終效果與此圖像類似，但具有淡出效果。

我已經可以生成隨機位置和淡出的文字，但是......顏色呢？有可能使這種顏色轉換並具有透明度？我的意思是，文字能有這種效果嗎？

作爲一個新手，我感謝任何幫助。

Answer 1

如果你想與透明度的文字，你只需要使用RGBA顏色是這樣的：

color: rgba(123,213,231,0.5); 

其中最後numner「0.5」是指顏色的透明度。 有關的顏色變化的動畫效果use transition

Answer 2

您可以隨機文字顏色使用javascript：

function randomColor() { 
    return 'rgba('+rgb()+','+rgb()+','+rgb()+','+alpha()+')'; 
} 
function rgb() { 
    var min = 0, 
    max = 255, 
    rcolor = Math.floor(Math.random() * (max - min) + min); 
    return rcolor; 
} 
function alpha() { 
    var min = 0.2, 
    max = 0.9, 
    randalpha = Math.random() * (max - min) + min; 
    return randalpha.toFixed(1); 
} 

https://jsfiddle.net/Ullvieib/cbuy2gka/