[CSS] 背景色をグラデーションにする

背景色をグラデーションにするには、linear-gradientを使用します。

グラデーションサンプル

以下、グラデーションのサンプルです。
グラデーションの方向や割合、色を指定することができます。

「上 → 下」へグラデーションする

例)上(white)→下(blue)

「上 → 中 → 下」でグラデーションする

例)上(white)→中(blue)→下(white)

「上 → 中1 → 中2 → 下」でグラデーションする

例)上(white)→中1(blue)→中2(blue)→下(white)

「左 → 右」でグラデーションする

例)左(white)→右(blue)

「左上 → 右下」でグラデーションする

例)左上(white)→右下(blue)

「左下上 → 右上」でグラデーションする

例)左下上(white)→右上(blue)

メモ


コメント

タイトルとURLをコピーしました