当前位置: 首页 > 工具软件 > Star Rating > 使用案例 >

java starrating_Change Color of every element dynamically in Star Rating

章嘉致
2023-12-01

I have implemented star rating and it works well. Now requirement is to have different color for each star where in my star color comes from CSS and its colored as GOLD. How can I give it different colors. for example - 1st star should be red, second blue, third green and so on..

Css:

.rating {

border: none;

float: left;

direction: ltr;

}

.rating>input {

display: none;

}

.rating>label:before {

margin: 5px;

font-size: 1.25em;

font-family: "Font Awesome 5 Free";

display: inline-block;

content: "f005";

font-weight: 900;

}

.rating>.half:before {

content: "f089";

position: absolute;

}

.rating>label {

color: #ddd;

float: right;

}

.rating>input:checked~label,

/* show gold star when clicked */

.rating:not(:checked)>label:hover,

/* hover current star */

.rating:not(:checked)>label:hover~label {

color: gold;

cursor: pointer;

}

 类似资料:

相关阅读

相关文章

相关问答