no image

CSSの基本的な知識をご紹介

CSSとは

CSSはスタイルシートなどとも呼ばれており、サイトのスタイルを指定するためのプログラミング言語です。
HTMLと組み合わせて使う言語であり、CSSによってHTMLで書かれた、各要素を装飾します。
つまりは、文章の文字を大文字にしたり、色を付けたり、または文章や画像の位置を指定することができます。

HTMLではページ一カ所にしか適用できない要素も、CSSならば、全てのページに適用させることもできて、大変便利です。
CSSを使うと、構文のレイアウトも簡潔になり、その分サイトの容量を減らすのにも役立ちます。

・CSSは必須

最近のサイトを作るならば、CSSは必須といえます。
しかしHTMLだけを使っても、ホームページは作ることができ、CSSのない時代にはHTMLやJavaScriptを使い、作ってきました。
HTMLだけでも、見栄えを良くして作ることは可能となってます。

しかしHTMLは最近の複数ページがあり、動的になっているページには向いていません。
HTMLで作成すると、構造が崩れてしまい、サイトの見栄えが崩れます。
しかもHTML自体の構造も崩れるために、検索エンジンに正しく認識されない可能性もあります。

これがCSSを使えば、最初にページの要素を定義すれば、全てのページに適用されます。
ヘッダーやフッターの内容を変えたいときでも、CSSを書き換えるだけで、すぐに適用されます。
HTMLであれば、全部のページのヘッダーやフッターを書き換えないとならず、労力の面でも大変になります。
CSSとHTMLをそれぞれ役割を変えて、サイト作成していけば、見やすく更新作業もしやすいです。

ブラウザによって表示が違う

CSSはブラウザごとに、構文をどのようにサイトに反映させるか、設定が違っています。
文字の大きさや位置など、サイトに同じ要素を書き込んだとしても、ブラウザごとに表示が違ってきます。
特に余白である、paddingは顕著であり、あるブラウザによっては余計に余白が出来て、サイトレイアウトが崩れます。

そのために、CSSを使ってサイトを作っていくならば、どのブラウザでも同じように見えるようにしないとなりません。
そのためには、CSSのどのようそが、どのブラウザで違って見えてくるのか、知っておかないと対処が出来ません。

ただ主要なブラウザを、すべて自分のパソコンにインストールして、わざわざ作成するたびに確認していては大変です。
そこで複数のブラウザでレイアウトを確認できるようになっている、ウェブサービスもあるので、そのようなものを使って確認しても良いでしょう。
もちろん、主要なブラウザをパソコンにインストールして確認しても構いません。

関連コンテンツ

注目コンテンツ