顏色
在 CSS 設定顏色的值有三種表示方式:
- 十六進位值
- 顏色名稱
- RGB 比例
要查詢顏色代碼可以用 Google 搜尋「color picker」就會出現一個選色器,可以取得十六進位代碼和 RGB 比例值。
十六進位代碼如果前兩碼、中間兩碼,和後面兩碼,兩兩相同,則可以用三碼表示。比如說:#FF3366 可以用 #F36 表示。十六進位代碼通常以#字號作為開頭。
RGB 則有兩種表示方式,一種是每組由0~255之間的數字表示,另一種是用 0%~100% 表示
p { color:#e33679; } |
#e33679 |
p { color:blue; } |
blue |
p { color: rgb(0,189,113); } |
R:0, G:189, B:113 |
p { color: rgb(0%,80%,40%); } |
R:0%, G:80%, B:40% |
漸層色
如果你想要使用漸層色,像這一頁這麼騷包,可以從這個網站取得CSS碼 ▶ Blend
再把它貼到你想要宣告的選擇器裡面,比如說 body 還是某個 div 裡面。
如果你只要變更這一頁,而不是網站裡所有的頁面,那你可能需要安裝 Code embed 來個別設定 CSS。
請參考:怎麼在個別文章/頁面加入 javascript 或 CSS?
▼像我這一頁的區塊套用一個選擇器叫做「pad」,所以我安裝了 Code Embed 後就在自訂欄位貼上如下宣告。
<style> .pad{ background: -webkit-linear-gradient(90deg, rgb(255, 208, 222), rgb(255, 246, 108)); background: linear-gradient(90deg, rgb(255, 208, 222), rgb(255, 246, 108)); } </style>
如果你是直接貼在「外觀 > 自訂 > 進階 > CSS」裡面的話,就把前後的<style>和</style>去掉。