css長度單位及顏色表示
阿新 • • 發佈:2018-11-25
css的長度單位:
- px:畫素,絕對單位
- em:相對單位,如果用於font-size屬性本身,則是相對於父元素的font-size。若用於其他屬性(width,height),則是相對於本身元素的font-size。所有未經調整的瀏覽器都符合: 1em=16px。
- rem:相對字型長度單位,只相對根元素即html元素字型大小。
- fr:自適應單位,fr單位被用於在一系列長度值中分配剩餘空間,如果多個已指定了多個部分,則剩下的空間根據各自的數字按比例分配。
css顏色表示:
- 十六進位制表示法:可表示為:#RRGGBB,其中RR(紅色),GG(綠色)和BB(藍色)。所有值必須介於0和FF之間。例如:#0000FF值呈現為藍色,因為藍色的組成設定為最高值(FF)而其他設定為0。也可表示為:#RGB,值也必須為0到f之間,例如:#00f表示為藍色。
- rgb表示法:表示法為:RGB(紅,綠,藍)。每個引數(紅色,綠色和藍色)定義顏色的亮度,可在0和255之間,或一個百分比值(從0%到100%)之間的整數。例如:rgb(0,0,255),表示為藍色,值越高,顏色混合佔比越多。
- rgba表示法:表示法為:RGBA(紅,綠,藍,alpha)。 Alpha引數是一個介於0.0(完全透明)和1.0(完全不透明)之間的引數。
- hsl色相表示法:表示法為:HSL(色調,飽和度,明度)。色相是在色輪上的程度(從0到360)-0(或360)是紅色的,120是綠色的,240是藍色的。飽和度是一個百分比值;0%意味著灰色和100%的陰影,是全綵。亮度也是一個百分點;0%是黑色的,100%是白色的。
- hsla色相表示法:表示法為:HSLA(色調,飽和度,亮度,α),α是Alpha引數定義的不透明度。 Alpha引數是一個介於0.0(完全透明)和1.0(完全不透明)之間的引數。
下圖是色調圖:
轉自——十二月出行