web前端第三次做業em，fr，rem，px簡單解釋及顏色表

     

   

     

       em是相對長度單位。相對於當前對象內文本的字體尺寸。如當前對行內文本的字體尺寸未被人爲設置，則相對於瀏覽器的默認字體尺寸，最初是指字母M的寬度，故名em。現指的是字符寬度的倍數，用法相似百分比，如：0.5em, 1em,2em等，一般1em=16px。

　　rem（root em，根em）：是CSS3新增的一個相對單位，相對的只是HTML根元素，能夠只修改根元素就能夠成比例地調整全部字體大小，又能夠避免字體大小逐層複合的連鎖反應。兼容性IE9+均可以兼容，對於不兼容的瀏覽器寫一個絕對單位的聲明就能夠了。

　　fr 單位是一個自適應單位，fr單位被用於在一系列長度值中分配剩餘空間，若是多個已指定了多個部分，則剩下的空間根據各自的數字按比例分配。

　　px全稱Pixel，譯：像素。它相對長度單位，像素 px 是相對於顯示器屏幕分辨率而言的。

　　

　　

　　px，em，rem的區別在哪？

　　Px是一個絕對字體大小，em則是基於基數（好比：1.5em）來計算出來的相對字體大小。這個基數是須要乘以當前對象從其父級遺傳字體大小。

 

　　1.5em = 父級字體大小 * 1.5 = ?

　　不過，這有個問題就是在css中想要知道當前元素的字體大小所遺傳的是哪一個父級元素的字號。所以，rem的出現就很好的解決了這個問題。rem是基於根節點（好比html）的字體大小進行計算的。

　　 1.5rem = 默認字體大小 (好比： 16px) * 1.5 = 24px

 

　　這個默認字體大小是依據你網站當前訪問時所使用的瀏覽器或者其餘設備來決定的，對於桌面瀏覽器默認是16px的字體大小。而後你如今要轉換當前元素的字體大小爲rem的時候你就能夠這樣作：

　　 28px = 28/16 = 1.75rem

 

　　爲了更方便的進行計算轉換，你能夠把默認字體大小設置成62.5%或者是10px，這個時候你要計算當前元素字體大小的時候，你就能夠這樣：

　　28px = 28/10 = 2.8rem

 

 

 

　　經常使用顏色對照表地址：http://tool.oschina.net/commons?type=3

　　我常常用瀏覽器自帶的顏色表,win10自帶的的3D畫圖，能夠查看rgb和16進制