好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

CSS颜色模式转换器的实现_html/css_WEB-ITnose

× 目录 [1]模式转换 [2]DEMO

前面的话

function rgbToSixteen(str){    var r16,g16,b16,sixteen;    if(/^rgb\((\d+)\,(\d+)\,(\d+)\)$/.test(str)){           if( RegExp.$1 >= 0 && RegExp.$1  = 0 && RegExp.$2  = 0 && RegExp.$3  

【3】HSL -> RGB

  HSL模式是通过对色调(H)、饱和度(S)、亮度(L)三个颜色通道的变化以及它们相互的叠加得到各式各样的颜色。HSL标准几乎可以包括人类视力所能感知的所有颜色

  h:色调(hue)可以为任意整数。0(或360或-360)表示红色,60表示黄色,120表示绿色,180表示青色,240表示蓝色,300表示洋红(当h值大于360时,实际的值等于该值模360后的值)

  s:饱和度(saturation),就是指颜色的深浅度和鲜艳程度。取0-100%范围的值,其中0表示灰度(没有该颜色),100%表示饱和度最高(颜色最鲜艳)

  l:亮度(lightness),取0-100%范围的值,其中0表示最暗(黑色),100%表示最亮(白色)

//参考http://stackoverflow.com/questions/2353211/hsl-to-rgb-color-conversionfunction hslToRgb(str){    var r, g, b;    var h, s, l;    if(/^hsl\((\d+)\,(\d+)%\,(\d+)%\)$/.test(str)){           if( RegExp.$1 >= 0 && RegExp.$1  = 0 && RegExp.$2  = 0 && RegExp.$3   1) t -= 1;                    if(t  

【4】RGB -> HSL

//参考http://stackoverflow.com/questions/2353211/hsl-to-rgb-color-conversionfunction rgbToHsl(str){    var r,g,b;    if(/^rgb\((\d+)\,(\d+)\,(\d+)\)$/.test(str)){           if( RegExp.$1 >= 0 && RegExp.$1  = 0 && RegExp.$2  = 0 && RegExp.$3   0.5 ? d / (2 - max - min) : d / (max + min);                switch(max){                    case r: h = (g - b) / d + (g  

DEMO实现

简易拾色器

16进制颜色转换器

RGB颜色转换器

HSL颜色转换器

查看更多关于CSS颜色模式转换器的实现_html/css_WEB-ITnose的详细内容...

  阅读:41次