새로 고침시 색 구성표 변경

Question

새로 고침 할 때 여러 요소의 CSS 배경색/색을 변경할 수 있습니다. 나는 또한 그들이 그룹으로 나타나길 바란다. 따라서 임의의 색상이 아닌 모든 것이 지정되고 "설정"됩니다. 가능하면 세 가지 색상 (예 : 파란색 배경, 진한 회색 텍스트, 흰색 링크)을 수행하고 싶습니다. - 파란색 배경, 어두운 회색 텍스트, 흰색 링크
색 구성표 2 - 다크 보라색 배경, 흰색 링크, 핑크 링크
색 구성표 3 - 흰색 배경, 검은 색 텍스트
색 구성표 1 : 예를 들어

, 녹색 링크

불행히도, 온라인에서 찾을 수있는 유일한 코드는 무작위 색상입니다.

내가 얻을 수있는 모든 도움에 감사드립니다.

편집 : Paulie_D 및 Matus의 의견에 이어 더 많은 연구와 여러 번의 시행 착오를 통해 자신의 코드를 작성하려고했습니다. 마침내 나는 this을 생각해 냈습니다.

HTML :

<link id="colorscheme" rel="stylesheet" type="text/css" href=""> 

자바 스크립트 :

그러나

var stylesheets = ["schemeone.css", "schemetwo.css"]; 
var rand = Math.floor(Math.random() * stylesheets.length); 

$(document).ready(function(){ 
document.getElementById("colorscheme").setAttribute("href", stylesheets[rand]); 
}); 

이 올리버의 코드는 하나 개의 CSS 파일에 색 구성표를 컴파일, 그래서 대안을 모든 사람들에게 대단히 감사합니다 누가 나에게 충고와 지시를 주 었는지.

Answer 1

당신이 Jquery로 태그를 붙인 것으로 나타났습니다.

$(document).ready(function() { 
    var listOfClasses = ["color-scheme-1","color-scheme-2","color-scheme-3"]; 
    var randomNum = Math.floor(Math.random() * listOfClasses.length); 
    $("html").addClass(listOfClasses[randomNum]); 
}); 

그런 다음 CSS를 당신이

html.color-scheme-1 { 
    background-color: #000000; 
    color: #000000; 
} 

html.color-scheme-1 a { 
    color: #000000; 
} 

html.color-scheme-2 { 
    background-color: #000000; 
    color: #000000; 
} 

html.color-scheme-2 a { 
    color: #000000; 
} 

html.color-scheme-3 { 
    background-color: #000000; 
    color: #000000; 
} 

html.color-scheme-3 a { 
    color: #000000; 
} 

그냥 색상 원하는 16 진수 코드로 대체 할 것이다 : 다음은 자바 스크립트입니다. Codepen