添加多非漸變顏色

Question

頂部邊框，我想在我的頁腳的頂部這跟幾個不同的顏色，因此添加邊框：http://i.imgur.com/Bf8ILCu.png

我環顧四周，我看到添加圖像，或漸變的例子，或者對於不同的側面有多種顏色，但是對於我想要做的事情無法找到任何東西。

Answer 1

您可以使用CSS漸變此。

看一看下面的代碼片段（您可以根據您的要求改變顏色）：

.border-top { 
 
    width: 100%; 
 
    height: 20px; 
 
    background: linear-gradient(to right, rgba(248,80,50,1) 0%, rgba(241,111,92,1) 10%, rgba(241,111,92,1) 10%, rgba(246,41,12,1) 10%, rgba(81,24,240,1) 10%, rgba(81,24,240,1) 23%, rgba(240,24,226,1) 23%, rgba(240,24,226,1) 34%, rgba(39,192,230,1) 34%, rgba(39,192,230,1) 46%, rgba(39,230,52,1) 46%, rgba(39,230,52,1) 58%, rgba(76,82,80,1) 58%, rgba(76,82,80,1) 69%, rgba(173,173,173,1) 69%, rgba(173,173,173,1) 81%, rgba(255,0,21,1) 81%, rgba(255,0,21,1) 91%, rgba(255,204,0,1) 91%, rgba(255,204,0,1) 100%); 
 
} 
 

 
body { 
 
    margin: 0; 
 
}

<div class="border-top"></div>

希望這有助於！