ブログ

【WEB制作の基本】CSSとは?

更新日:2023年04月22日
【WEB制作の基本】CSSとは?

WEBサイトを作成するのに欠かせないものに「CSS」があります。

HTMLでWEBページの骨組みを構築するのに対して、CSSは見た目の装飾を整えます。
色、文字の大きさ、レイアウトの幅や高さ、背景等CSSを用いればWEBページのデザインを自由自在に変更することができます。

この記事では、CSSの特徴や書き方を解説していきます!

CSSとは

CSS(Cascading Style Sheets)は、WEBページを作成するためのマークアップ言語です。
例えば文字や背景の色、テキストや画像の配置などをCSSで指定します。
HTMLは、WEBページのレイアウトやデザインを決める役割を持っています。

CSSの書き方

CSSは、以下の3つの要素で構成されています。
1. セレクタ
セレクタは、HTMLの中でデザインを適用するタグを記述します。
2. プロパティ
プロパティは、適用させるデザインの種類を記述します。
3. 値
値は、プロパティに対応した値を記述します。

実際にCSSでデザインする際は、以下のように記述します。
セレクタ {
 プロパティ: 値;
}

CSSの記述方法

CSSをWEBページに適用させる方法として、以下の3つが挙げられます。

1. 外部ファイルとして読み込む
<head>
    <link rel="stylesheet" href="style.css">
</head>
2. head要素内に記述する
<head>
  <style>
    h1 {
      color: #ffffff;
    }
    p {
      color: #000000;
    }
  </style>
</head>
3. HTMLタグに記述する
<h1 color="#ffffff">見出し、見出し、見出し</h1>
<p color="#000000">段落、段落、段落</p>

私たちにお任せください

フェア・デザインではホームページから
動画・グラフィックまで各種制作依頼を
幅広くお受けしております。
まずはお気軽にお問い合わせください。

お問い合わせ
お問い合わせ