スタイルシート(CSS)とは

スタイルシートとHTML

WEBページはHTMLタグと呼ばれるもので構成されています。

例えば、見出しや段落一つずつにそれぞれのタグが決められており、これらのタグを複数記述することで1つのWEBページを作成します。

本来、HTMLでは文書構造のみを記述することが目的ですが、より凝ったデザインや配色が求められ、HTMLでもこれらの”味付け”を出来るように改良が進められてきました。

しかし、HTMLにこれらのデザインも含ませて記述していくと以下のようなデメリットが出ることになります。

HTMLだけでのデザインの弊害

  • HTMLに文書とデザインが混合してしまい、構造が複雑化する
  • 同じデザインを複数の場所に指定するとき、何度も同じ設定をする必要がある
  • デザインの統一化が難しい
  • デザインを変えようと思ったとき、全てのHTMLファイルを修正しなければならない

スタイルシートの役割

このようなデメリットを払拭するために考えられたのがスタイルシートです。

スタイルシートを利用することで、HTMLを文書構造、スタイルシートをデザイン、のように両者を完全に独立させつつ、互いに連携をとることでそれぞれの役割を明確にすることができるだけでなく、SEOなどの検索エンジン対策にも効果を発揮できます。

スタイルシートの種類

スタイルシートは複数存在します。このスタイルシートの中で標準化されているのがCSS(Cascading Style Sheet)です。

これはW3Cという団体が明確に策定しており、世の中の多くのブラウザはこのCSSに標準対応しています。

例えば、Internet Explorer、Netscape、FireFox、Opera、SafariなどはこれらのCSSに対応しています。

本スタイルシート辞典はこのCSSを解説していきます。

【厳選】合わせて読みたいおすすめ書籍

WEB制作支援サイトのHTMLタグボードだからオススメできる厳選書籍です。私が読んでいない本はオススメしません。

HTMLやCSS、Webデザインを体系的に学ぶなら

CSSを駆使したモダンなWebデザインを学ぶなら

最新情報をチェックしよう!