認真的F
@MajimeF
Wed, Oct 27, 2021 2:54 PM
Wed, Oct 27, 2021 3:32 PM
2021/10/27（三）
線上課程 網頁開發 學習進度 進度紀錄 60/554。複習日。
https://www.udemy.com/...
54、RGB, RGBA, HEX, HSL。
55、CSS Comment 快速設置。
認真的F
@MajimeF
Wed, Oct 27, 2021 2:54 PM
上一噗：
@MajimeF - 2021/10/26（二） #線上課程 #網頁開發 #學習進度 #進度紀錄 60/...
認真的F
@MajimeF
Wed, Oct 27, 2021 2:54 PM
此課程 書籤噗 ：
@MajimeF - #書籤噗 #線上課程學習紀錄 #網頁開發
認真的F
@MajimeF
Wed, Oct 27, 2021 2:56 PM
上一課的延續。

RGB 是三個數字。
RGBA 是四個數字。第四個數字是 alpha，透明度。值在 0 到 1 之間。
認真的F
@MajimeF
Wed, Oct 27, 2021 3:00 PM
CSS RGB and RGBA Colors
認真的F
@MajimeF
Wed, Oct 27, 2021 3:01 PM
0 代表 100％ 透明。反白才看得到。
1 代表完全不透明。是預設值。
0.5 半透明。
認真的F
@MajimeF
Wed, Oct 27, 2021 3:02 PM
例：
h2 {
color: rgba(0, 0, 255, 0.7);
}
認真的F
@MajimeF
Wed, Oct 27, 2021 3:04 PM
變化還滿微妙的……
比如 0.7 與 0.8 其實就很接近 1 不透明XD
認真的F
@MajimeF
Wed, Oct 27, 2021 3:05 PM
【HEX】
hex→hexadecimal 十六進制

英文字拆解：
hex 與6有關的
decimal 十進制
認真的F
@MajimeF
Wed, Oct 27, 2021 3:05 PM
二進制：01
十進制：0123456789
16進制：0123456789ABCDEF
認真的F
@MajimeF
Wed, Oct 27, 2021 3:08 PM
老師做得方便網站：
Coloors
有 range 可以拉。
點擊就能複製色碼。

可以隨機產生，也能固定喜歡的顏色再隨機產生。
還能儲存喜歡的顏色。
認真的F
@MajimeF
Wed, Oct 27, 2021 3:11 PM
Colors HEX
CSS HEX Colors
認真的F
@MajimeF
Wed, Oct 27, 2021 3:13 PM
HEX 應該是一般最常看到的吧。
包含井字號，共七碼。
認真的F
@MajimeF
Wed, Oct 27, 2021 3:14 PM
像 reserved color 那樣直接貼上色碼即可。

例：
h3 {
color: 4c06f4;
}
認真的F
@MajimeF
Wed, Oct 27, 2021 3:16 PM
【HSL】
也是設定三個數字
hsl(hue, saturation, lightness)

hue 顏色
saturation 飽和度
lightness 亮度
認真的F
@MajimeF
Wed, Oct 27, 2021 3:17 PM
Colors HSL
認真的F
@MajimeF
Wed, Oct 27, 2021 3:17 PM
不過老師覺得這個不好用所以點到為止而已。
他覺得用 HEX 就夠了XD
認真的F
@MajimeF
Wed, Oct 27, 2021 3:27 PM
55、CSS Comment 快速設置

CSS 註解：
Slash + 米字號 + 米字號 + Slash

Slash＝/
米字號＝*
認真的F
@MajimeF
Wed, Oct 27, 2021 3:28 PM
快速設置：
Ctrl + /
認真的F
@MajimeF
Wed, Oct 27, 2021 3:31 PM
HTML 中也可以用。
多行也可以。

一樣是選取後 Ctrl + /
會自動對齊。
認真的F
@MajimeF
Wed, Oct 27, 2021 3:38 PM
其實不用選取也可以XD
游標在該行就能用 Ctrl + /。
認真的F
@MajimeF
Fri, Oct 29, 2021 4:43 AM
下一噗：
@MajimeF - 2021/10/28（四） #線上課程 #網頁開發 #學習進度 #進度紀錄 60/...
載入新的回覆