素材のスタイルシートへの組み込み方法
グラデーション素材のスタイルシートへの組み込み方法は、背景画像へのリピート素材として使用する方法が一般的です。
スタイルシートへの追加方法
background-image: url(素材のURL);
background-repeat: repeat;
このrepeatの値を変化させることで、繰り返しの表示方法を変えることができます。
- background-repeat: repeat; 縦と横方向に素材をリピートで表示
- background-repeat: repeat-x; 横方向に背景素材をリピート
- background-repeat: repeat-y; 縦方向への繰り返し表示
- background-repeat: no-repeat; 一度だけの表示で繰り返さない。
グラデーション素材の場合、両端で色彩が違いますので、背景画像をリピートにするとまだらになってしまいます。
ですので、画像加工で反転させて両端を同じ色彩にするとか、一度だけ表示させてから、あとは同じような色彩を表示させるとかの方法がおすすめです。