CSSとは

CSSはCascading Style Sheets(スタイルシート)の略です。CSSを使うことでWebページのデザインを従来より詳細に設定することができます。HTMLに情報を、CSSに見た目を記述することで、HTMLの中に両方を詰め込んでいた時代に比べ人間からも機械からも情報をより読み取りやすくなりました。CSSはW3C(World Wide Web Consortium)という団体により、Web標準の技術として推奨されています。

デザインの詳細化

例えば文字に対して、HTMLでは文字サイズは7種類しか設定できませんが、CSSを設定するとピクセルをはじめとするさまざまな単位で細かく設定可能です。

デザインの再利用

何ヶ所にもわたって同じ書式を設定するのもCSSの方が便利です。HTMLの中でクラス名を使い回すだけですみますし、CSSのプロパティを変更すれば、一気に大量の文字列の書式を変更することも簡単です。

レイアウトにCSSを使用

CSSはレイアウトを設定するときも威力を発揮します。昔はテーブルを用いてレイアウトを設定していましたが、今はCSSを使うことが多くなっています。メンテナンスも楽ですし、SEO対策でもCSSの方が有利だからです。HTMLファイルが軽くなることと、検索エンジンのロボットが内容を読み取りやすくなるからです。

CSSの記述例

それではCSSの記述例を見てみましょう。

.example {font-size: 15px; }

.exampleはセレクタ(ここではクラス)です。.はクラス名が続くことを表し、exampleはクラス名です。font-sizeはプロパティ名、15pxは値です。

HTMLファイルにexampleクラスが指定されている範囲では、文字サイズを15pxで表示するということです。

広告