「CSSでグラデーションその1」の編集履歴（バックアップ）一覧に戻る
グラデーションについて記述していきます。
目次
色が連続的に変化すること。
一昔前、webページ制作の時のグラデーションの作り方は、幅10px×高さ60pxなどの画像でグラデーション画像を作り、CSSのbackgroundでその画像を指定し右方向に敷き詰めたり(repeart-x)したりして作っていました。
今では画像を用意せず、CSSのみで記述できるようになってきました。
CSSの記述のみでグラデーションを作る
メリットは、画像を作る必要がなくなるので、制作がより早くなるという点です。一方、デメリットでは、グラデーションは昔のブラウザには対応しないや、ブラウザごとにグラデーションのプロパティの表現が違うため、クロスブラウザ対応する場合にめんどくさい。
などの部分があったりします。
昔のブラウザでも表現できるように画像にしようぜ！と思いがちな人は多いかと思いますが、セキュリティやリッチコンテンツのことを考えるとやはりCSSのみで表現できる方向を学習していかなければなりません。
グラデーションをうまく見せるコツは、 開始色と終了色が十六進法表記であまり変わらない色にするということです。また、カラーパレットで近い色にして見せることです。カラーパレットを参照
※赤丸近辺ぐらいの範囲で開始色と終了色を選んでいく。
divでなにかボックスを作ったり、liタグでメニューを作ったり、h1タグで見出しを作ったりとボックスレベル要素があるタグを使う場合、有効です。
テキストのグラデーション
