用了很長時間的RGB方式來作為css中的顏色樣式，卻不知道它是什么原理，據說這還是一道面試題，這篇文章就用來總結一下它的原理。
我們生活中最常見的光就是太陽光，據說在1672年牛頓用三棱鏡將太陽光分離成了赤橙黃綠藍紫青七色光。隨著科技的進步，人們發現肉眼細胞對紅綠藍三種顏色較為敏感，而且這三種顏色按照不同比例混合會制造出很多其他的顏色，比如7色光中的其他4種顏色就可以用紅綠藍配比出來，是不是很神奇？這有點像電子數字，可以通過8衍生出其他九種數字。
圖1
基于上面的理論，咱們就可以在計算機世界里用紅綠藍的搭配來顯示各種顏色。
目前RGB方式是將這三種顏色各用一個字節表示，每個字節8位，每位的大小是0到255，即這三種顏色每一個有256個選擇，RGB一共可以表示256*256*256=16777216種顏色。雖然這并不能完全描述自然界中所有的光，但已經可以滿足正常的生活需要了。
在CSS中，我們的寫法如下：
#p1 {background-color:rgb(255,0,0);} /* 紅 */
#p2 {background-color:rgb(0,255,0);} /* 綠 */
#p3 {background-color:rgb(0,0,255);} /* 藍 */
RGB括號中每一位數字都要在0到255之間。
CSS顏色還有另外一種寫法，如下：
#p1 {color: #001122}
因為每個顏色是8位，所以還可以將每位顏色轉成2位的16進制，三種顏色就是6位。
對于上面重復的數字還可以簡寫，如下：
#p1 {color: #012}
在CSS代碼規范里面咱們可以做一些代碼的檢測，至少可以少寫幾個字符。
存儲格式
1、RGB565
這種方式用16位二進制來表示一個像素的顏色，紅色5位，綠色6位，藍色5位；
2、RGB55
這種方式也是用16位表示一個像素的顏色，但是最高位是保留位，不用，剩下的15位被三種顏色平分，即各五位。
3、RGB24
這種方式每個顏色用一個字節表示，和原理中說的方式一致。
4、RGB32
這種方式每個顏色用一個字節表示，還剩一個字節為保留位，不用。
5、ARGB32
這種方式用4個字節表示顏色，前三個字節分別表示紅、綠、藍，最后一個字節表示透明度alpha。
總結
在實際生活中我們有很多三原色的應用場景，比如電視，它顯示的每個像素點可以認為是隱藏在屏幕后面的三種顏色的小燈照射形成的。所以三原色原理不僅應用在web頁面中，生活中的應用場景也隨處可見。
