CSS顏色
學習如何在CSS中使用顏色 默認情況下，網頁瀏覽器在使用顏色方面的渲染效果相當低劣。 我們有白色背景、黑色文字和藍色連結。這只是這樣而已。 幸運的是，CSS給了我們在設計中添加顏色的能力。 我們有以下屬性： color background-color border-color 所有這些屬性都接受一個顏色值，可以以不同的形式呈現。 命名顏色 首先，我們有CSS關鍵字定義的顏色。CSS一開始只有16個，但如今有大量的顏色名稱： [中文翻譯略] 除了“tranparent”和“currentColor”以外，它們都是CSS顏色模組4的一部分，它們是大小寫不敏感的。 維基百科有一個很好的表格可以根據名稱選擇完美的顏色。 命名顏色並不是唯一的選擇。 RGB和RGBa 您可以使用“rgb()”函數根據RGB表示法計算顏色，根據其紅綠藍部分設置顏色。範圍從0到255： p { color: rgb(255,255,255); /* white */ background-color: rgb(0,0,0); /* black */ } “rgba()”讓您可以添加alpha通道以輸入透明部分。這可以是0到1的數字： p { background-color: rgba(0,0,0,0.5); } 十六進位表示法 另一個選擇是使用十六進位表示法表示顏色的RGB部分，它由3個塊組成。 黑色，即“rgb(0,0,0)”，可以表示為“#000000”或“#000”（如果兩個數字相等，我們可以將2個數字簡化為1個）。 白色，即“rgb(255,255,255)”，可以表示為“#ffffff”或“#fff”。 十六進位表示法允許我們使用2位數來表示0到255之間的數字，因為它們可以從0到15（f）。 通過在末尾添加1或2個更多的數字，我們可以添加alpha通道，例如“#00000033”。並非所有瀏覽器都支持簡短的表示法，因此請使用全部6個數字來表示RGB部分。 HSL和HSLa 這是CSS的一個相對較新的添加。 HSL = 色相 飽和度 明度。 在這種表示法中，黑色為“hsl(0, 0%, 0%)”，白色為“hsl(0, 0%, 100%)”。 如果您對HSL比RGB更熟悉，由於您的過去知識，您肯定可以使用它。 您還可以使用“hsla()”將alpha通道添加到混合中，再次是0到1之間的數字：hsl(0, 0%, 0%, 0.5)