知っておくべきポイント
CSSグラデーション、 P.78の「ストライプ模様の背景」
課題
P.78の「ストライプ模様の背景」では、 CSS グラデーションを使って
さまざまなストライプを作成しました。しかし、背景のパターンはストラ
イプだけではなく、幾何学的なパターンにもさまざまなものがあります。
例えば格子、水玉、市松模様などがよく使われます。
CSSグラデーションを使うと、これらの多くを生成できます。あまり実
用的ではないものもありますが、ほとんどの幾何学的なパターンはCSS グ
ラデーションを使って実現できます。ただし、不注意に作成すると、保守
の困難なコードが大量に生まれてしまうこともあります。複雑さが増すた
びに、コードのDRY さは減少します。CSSを使ってパターンを生成する際
には、 Sass(sass‐lang.com)などのプリプロセッサを使い、繰り返し
の回数を減らすのがよいでしょう。
このシークレットでは、比較的作りやすく利用頻度も高いと思われるも
のをいくつか紹介します。
複雑な背景のパターン
6