雖然色碼表可隨時上網查,但自己來寫一個吧!
只用RGB各1碼就好,這樣就有16*16*16=4096的顏色了,
先以html的語法寫了幾行,大概是這樣
<table>
<tr>
<td width=40 height=25 bgColor=#004></td>
<td width=40 height=25>#004</td>
<td width=40 height=25 bgColor=#00c></td>
<td width=40 height=25>#00c</td>
</tr>
</table>
加入CSS
td{
width: 3%;
height: 20px;
}
html
<table>
<tr>
<td bgColor=#004></td>
<td>#004</td>
<td bgColor=#00c></td>
<td>#00c</td>
</tr>
</table>
在將html改成javascript,red跟green間隔3,blue間隔1
<table>
<script>
for (color_r=0; color_r<16 ; color_r+=3){
for (color_g=0; color_g<16 ; color_g+=3){
document.write("<tr>");
for (color_b=0; color_b<16 ; color_b+=1){
color_rgb = color_r.toString(16)+color_g.toString(16)+color_b.toString(16);
document.write('<td bgColor=#'+color_rgb+'>');
document.write("</td>");
document.write("<td>");
document.write('#'+color_rgb);
document.write("</td>");
}
document.write("</tr>");
}
}
</script>
</table>
當然,目前語法並不熟悉,所以還是都要問google大師(比翻書快,又能查的到),
如: javascript轉16進位,就可查到 .toString(16)
這裡有一個地方不甚了解,tbale中width瀏覽器的處理方式,
可以看到顏色跟數值的寬度是不一樣的,但是設的都是3%,
也就是瀏覽器自己會去調整寬度,以後再研究.
rgba(),即rgb()再增加一個不透明度的參數alpha 值,1表示完全不透明,0表示完全透明
或可以在rgb(),後在設定transparent()的透明度參數
hsla() : 不用rgb()也可以考慮用hsla() ,好處是可以以飽和度跟亮度值下去思考。
hue 值 (色相值) 0 或 360 →紅色, 60 →黃色, 120 →綠色, 240 →藍色,就好像彩虹色繞成一個圓。
saturation 值 (飽和度值) 0% ~ 100% 的百分比值, 0% →灰色調, 100% →最大飽和度。所以 0% 時,不論 hue 值是多少,都會以灰階單色呈現。
lightness 值 (亮度值)0% ~100%的百分比值,0%→最暗(暗黑),100%→最亮(亮白),50%→正常亮度。50% 以上漸漸增加白色,50% 以下漸漸增加黑色。
alpha 值 (alphavalue) 0.0 ~ 1.0 允許小數一位的數值。