線性漸層 (Linear gradient) | CSS

線性漸層

linear-gradient(箭頭方向, 開始顏色, 朝著箭頭逐漸變成甚麼顏色)

#0000ff ↑ #ff0000

To Top (0deg)

#0000ff ↗ #ff0000

To Top Right (45deg)

#ff0000 → #0000ff

To Right (90deg)

background-image: linear-gradient(to top, #ff0000, #0000ff);
background-image: linear-gradient(to right, #ff0000, #0000ff);
background-image: linear-gradient(to bottom, #ff0000, #0000ff);
background-image: linear-gradient(to left, #ff0000, #0000ff);
background-image: linear-gradient(45deg, #ff0000, #0000ff);
background-image: linear-gradient(-30deg, #ff0000, #0000ff);
...

linear-gradient(箭頭方向, 開始顏色, 顏色2, 顏色3, … )

→

1	background-image: linear-gradient(to right, #ff2121, #ffb42a, #d3f100, #00d470, #007bfe, #3000d8, #9e00e2);

← 攻擊伺服器 | 快速與服務溝通滑鼠相關 (Cursor) | CSS →