这个问题是有点模糊的&,我不确定你的意思是什么,但是你可以做一个颜色渐变。 请看这里的工作示例 ,这里是( jsfiddle ) 。
html :
css:#scale div {
float: left;
width: 50px;
padding: 10px;
border: 1px #333 solid;
}
Javascript ( Jquery ):$(document).ready(function() {
var scales = $('#scale').children('div');
var length = scales.length;
console.log(scales);
//loop through all the scales
scales.each(function(idx, scale) {
var red = 255;
var green = 255 - (idx/length) * 255;
var blue = 255 - (idx/length) * 255;
var rgb = 'rgb(' + red + ',' + green + ',' + blue + ')'
$(scale).css('background-color', rgb);
});
});
调整 JavaScript &中的颜色,以适合你的站点需求- 现在它是红色的,因为你有问题。
编辑:如果这不会改变所有这些或者不是动态的,你可以能更好地解决了 static 解决方案。 你可以在这里查看 ,我在这里使用CSS和硬编码的颜色,每一个"百分比"。