2018年07月13日
repeating-linear-gradient()
◆最後の色に位置指定（必須）すると、そこを境界にして繰り返す
background-image:repeating-linear-gradient(to right,aqua,white 100px);
・100pxごとに水色から白へのグラデーションを繰り返す
background-image:repeating-linear-gradient(90deg,yellow,yellow 100px,aqua 100px,aqua 200px);
・200pxごとに黄色と水色のベタ塗りを繰り返す
◆最初の色に位置指定すると、そこを境界にして前後に繰り返す
background-image:repeating-linear-gradient(to right,lime 30%,white 70%);
・30%地点を境界にして、
40%ごとにライム色から白へのグラデーションを前後に繰り返す
background-image:repeating-linear-gradient(90deg,yellow 50%,yellow 65%,aqua 65%,aqua 80%);
・50%地点を境界にして、
30%ごとに黄色と水色のベタ塗りを前後に繰り返す
background-image:repeating-linear-gradient(to right,aqua,white 100px);
・100pxごとに水色から白へのグラデーションを繰り返す
background-image:repeating-linear-gradient(90deg,yellow,yellow 100px,aqua 100px,aqua 200px);
・200pxごとに黄色と水色のベタ塗りを繰り返す
◆最初の色に位置指定すると、そこを境界にして前後に繰り返す
background-image:repeating-linear-gradient(to right,lime 30%,white 70%);
・30%地点を境界にして、
40%ごとにライム色から白へのグラデーションを前後に繰り返す
background-image:repeating-linear-gradient(90deg,yellow 50%,yellow 65%,aqua 65%,aqua 80%);
・50%地点を境界にして、
30%ごとに黄色と水色のベタ塗りを前後に繰り返す
この記事へのコメント
コメントを書く
この記事へのトラックバックURL
https://fanblogs.jp/tb/7887086
※言及リンクのないトラックバックは受信されません。
この記事へのトラックバック
