CSS chọn một màu ngẫu nhiên từ mảng

Question

Có cách nào trong CSS để làm cho nó chọn một màu phông chữ ngẫu nhiên từ một mảng không? Tôi biết tôi có thể làm điều này với phía máy chủ hoặc javascript, nhưng tôi tự hỏi nếu có cách CSS tinh khiết để làm điều này.

Answer 1

Điều này là không thể trong CSS, đó là xác định chắc chắn. Bạn có thể làm điều này với client-side JavaScript, mặc dù:

var colors = ['#ff0000', '#00ff00', '#0000ff']; 
var random_color = colors[Math.floor(Math.random() * colors.length)]; 
document.getElementById('title').style.color = random_color; 

Nếu bạn đang sử dụng jQuery, dòng cuối cùng có thể trở thành

$('#title').css('color', random_color); 

Answer 2

đơn giản trong JavaScript với JQuery.

Bạn có thể làm một cái gì đó như:

var hexArray = ['#hexVal','#hexVal','#hexval', '#hexval'] 
var randomColor = hexArray[Math.floor(Math.random() * hexArray.length)]; 

$("#divId").css("color",randomColor); //A class selector would work too 

Trong đó sẽ chọn màu mới mỗi lần làm mới trang.

Answer 3

Biểu thức CSS (cho phép nội dung tập lệnh động qua CSS) là những sự ghê tởm được đúc trong địa ngục không hiệu quả cùng với Biểu mẫu web, chỉ được hỗ trợ bởi IE7 trở xuống. Nhưng kể từ khi bạn hỏi.

<style> 
blink marquee { 
    color: expression("rgb(" + Math.floor(Math.random() * 255) 
     + "," + Math.floor(Math.random() * 255) + "," 
     + Math.floor(Math.random() * 255) + ")"); 
} 
</style> 
<blink> 
    <marquee> 
     color me beautiful 
    </marquee> 
</blink> 

Answer 4

Đây là cách tôi đã làm.

Phần thứ nhất là một thứ tự tuần tự, yếu tố 1 được màu 1 vv

Sau đó, khi bạn ra khỏi màu sắc nó sẽ ngẫu nhiên nó.

//Specify the class that you want to select 
var x = document.getElementsByClassName("ms-webpart-chrome-title"); 
var i; 
var c; 

//specify the colors you want to use 
var colors = ["#009933", "#006699", "#33cccc", "#99cc00", "#f60"]; 
var d = colors.length; 

for (i = 0; i < x.length; i++){ 
    while (i < d) { 
     c = i; 
     var random_color = colors[c]; 
     x[i].style.borderTopColor = random_color; 
     i++; 
    } 
    while (i >= d) { 
     var random_color = colors[Math.floor(Math.random() * colors.length)]; 
     x[i].style.borderTopColor = random_color; 
     i++; 
    } 
} 

Answer 5

mà không sử dụng bộ màu được xác định trước, để có được một hàm màu thống nhất ngẫu nhiên

function randomColor(){ 
    rc = "#"; 
    for(i=0;i<6;i++){ 
     rc += Math.floor(Math.random()*16).toString(16); 
    } 
    return rc; 
} 

hoặc inline

"#"+Math.floor(Math.random() * 0x1000000).toString(16)