CSSレイアウトの魅力 − 容易なデザイン変更

CSSレイアウトの魅力 − 容易なデザイン変更

CSSの利点は訪問者のためだけではありません。CSSには3種類の記述方法がありますが（CSSの記述方法参照）、この内の「外部ファイルによる記述」を行うことで、デザインの変更を簡単に行うことができるのも大きな利点のひとつです。

外部ファイルによるCSSの記述では、サイト内の全てのページから外部CSSファイルに対しリンクをはる形になりますが、この外部ファイルでの記述を修正することで、各ページで使われている同じid・クラス名の部分を一括して変更することができます。

例えば、全てのページで「背景色を赤、文字色を白」という部分があったとします。この部分に「class="bg-red-font-white"」というクラス名を当て、外部CSSファイルに以下のように記述します。

このような状態から背景色を黒に変更したいときは、外部ファイルの背景色の指定部分「bakcground:#ff0000」を「bakcground:#000000」に変更することで、「class="bg-red-font-white"」が記述された部分全ての背景色を一気に変更することができます。

背景色以外にもサイトの幅やフォントサイズ、罫線の有無・色など、共通のid・クラスを付けた部分であれば同じように変更できるわけですが、ホームページビルダーを利用している場合などでは、全ページに共通の部分に変更を加えようとすると全てのページに修正をかけなければならず、とても手間がかかります。その手間を、CSSを利用（外部ファイル化が前提）することで、大きく軽減させることができます。