マークアップ言語「CSS」でできること

「CSS」は、Cascading Style Sheetsから来ています。同じくマークアップ言語であるHTML文書をブラウザやプリンタに出力する際の表示スタイルを整えるために必要な言語です。

HTMLの処理だけでも理屈上Webページは作れますが、味気ないものになってしまうので、HTMLを覚える際には必ずCSSもペアで覚えてしまうようにしましょう。では、詳しく見ていきます。

フロントエンドに不可欠

Webページを記述するフロントエンドは基本的に「HTML（マークアップ言語「HTML」でできること）」、「CSS」、「JavaScript（プログラミング言語「javascript」ででできること）」で成り立っています。そして、HTML、JavaScriptにとってCSSは無くてはならない存在なのです。

CSSを書く際にできること

マークアップ言語であるCSSはプログラミング言語の「Ruby」や「JavaScript」などとは書き方が大幅に異なります。それでは、CSSの具体的な特徴をここで説明します。

 

■関連記事■

１：セレクタで要素を指定できる

セレクタとは、スタイルを適用したい部分を指定するものです。CSSのセレクタを使い、HTMLでスタイルを変えたいタグを指定することができます。

２：プロパティで適応するスタイルを指定できる

プロパティとは、スタイルの種類を表す名前です。要するに、セレクタでタグが指定されると、プロパティでスタイルを決めることができます。この時、文字色・背景色・文字サイズ・余白・高さ・幅など様々な内容を調整することができます。

３：ボックスモデルの利用

ボックスモデルを利用し、margin,border,padding,heightなどと言った表現を使うことで、ボックスで表示領域を生成できます。これにより、文章を表示したい範囲を指定することができるのです。

CSSのメリット・デメリット

それでは、CSSにはどのようなメリット・デメリットがあるのでしょうか。

それぞれ一つずつ見ていきます。

CSSのメリット

HTMLだけでも、サイズや色を指定することができますが、CSSを活用した方が文章構造がわかりやすくなります。また、ページが変わっても基本的な構造は同じようにしたい場合、CSSを活用することで共通のフォームが作りやすくなります。

CSSのデメリット

ブラウザによってはスタイルが崩れてしまう場合があります。どのブラウザが非対応か確認するサイトなどもありますので、公開前に確認する必要がありますね。

また、CSSはあくまで装飾がメインなので、それ単独ではWebページを作れないのもデメリットです。

まとめ

CSSはWebページを作る上で欠かすことができないマークアップ言語です。しかし、基本的にCSSだけではWebページを作ることはできません。学ぶ時にはHTMLと一緒に学ぶのが効率的でしょう。実際に、その方が効果的です。

CSSを使いこなせれば、文章構造を整え、統一感のあるWebページを構築することができます。

まず、一度HTMLで構造を作ったのちに、CSSを活用して色々なスタイルを変えられることを実感してみてください。