備忘録

背景色を2色で分割表示する方法【コピペ】

表示例

code:

background :linear-gradient(90deg,blue 0%, blue 50%,red 50%,white 100%);
background :linear-gradient(90deg,blue 0%, (左半分の色) 50%,red 50%,(右半分の色) 100%);

順番に

background:linear-gradient (方向角度,色 位置,色 位置,...);

となっています。

 

方向角度・グラデーションの向き

0deg          ↑      (下から上へ)
90deg   →    (左から右へ)
180deg      ↓      (上から下へ)
270deg      ←    (右から左へ)

角度ではなく以下のキーワードで指定することも可能です。

to top    =  0deg
to right    =  90deg
to bottom     = 180deg
to left    = 270deg

ブログ村

-備忘録
-, , , , ,

© 2024 GINGER.COM Powered by AFFINGER5