html中基於紅綠藍三基色的配色方案和透明度的調整


色光三原色

紅色(red):r --- 紅通道

綠色(green):g ---綠通道

藍色(blue):b ---藍通道

1.十進制方式調色

  color: rgb(128, 255, 0);   // 三個十進制數分別對應  紅--r,綠--g,藍--b,取值范圍  0-255,此方式不能調整透明度

或 

  color: rgba(128, 255, 0, 0.3);  // 前三個十進制數分別對應  紅--r,綠--g,藍--b,取值范圍  0-255;第四個數值調透明度 對應 --a,取值范圍0~1,0為全透明,1為完全不透明

 

2.十六進制方式調色

  color: #0088ff;  // 除去符號#,余下六位字符每兩位一組,分別對應  紅--r,綠--g,藍--b,取值范圍  00~ff,不區分大小寫,此方式不能調整透明度

或 

  color: #0088ff3D;  // 除去符號#,余下八位字符每兩位一組,分別對應  紅--r,綠--g,藍--b 和 透明度--a,取值范圍  00~ff,不區分大小寫,可通過調整最后兩位調整透明度,00為全透明,ff為完全不透明

注:十六進制的每一位的取值僅可為 0-9和a-f  或  0-9和A-F

小貼士:

16進制色值透明度對照
100% — FF、  99% — FC、  98% — FA、  97% — F7、  96% — F5、
95% — F2、    94% — F0、  93% — ED、  92% — EB、  91% — E8、
90% — E6、    89% — E3、  88% — E0、  87% — DE、  86% — DB、
85% — D9、    84% — D6、  83% — D4、  82% — D1、  81% — CF、
80% — CC、   79% — C9、  78% — C7、  77% — C4、  76% — C2、
75% — BF、    74% — BD、  73% — BA、  72% — B8、  71% — B5、
70% — B3、    69% — B0、  68% — AD、  67% — AB、  66% — A8、
65% — A6、     64% — A3、  63% — A1、  62% — 9E、  61% — 9C、
60% — 99、     59% — 96、  58% — 94、  57% — 91、  56% — 8F、
55% — 8C、    54% — 8A、  53% — 87、  52% — 85、  51% — 82、
50% — 80、     49% — 7D、  48% — 7A、  47% — 78、  46% — 75、
45% — 73、     44% — 70、  43% — 6E、  42% — 6B、  41% — 69、
40% — 66、     39% — 63、  38% — 61、  37% — 5E、  36% — 5C、
35% — 59、     34% — 57、  33% — 54、  32% — 52、  31% — 4F、
30% — 4D、     29% — 4A、    28% — 47、  27% — 45、  26% — 42、
25% — 40、      24% — 3D、    23% — 3B、  22% — 38、  21% — 36、
10% — 1A、      9% — 17、   8% — 14、  7% — 12、   6% — 0F、
5% — 0D、        4% — 0A、  3% — 08、  2% — 05、     1% — 03、  0% — 00

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM