CSSとは

CSS(Cascading Style Sheets)

文章構造と体裁を分離させるという理念を実現する為に提唱されたスタイルシートの具体的な仕様のひとつ。「cascade」=「階段状に流れる滝」のように親要素から子要素、孫要素にスタイルが継承する特徴を意味している。

スタイルシートの役割を実感できるサイト

メリット

  • サイトの重さ軽減
  • 文章構造を保ちながらの自由なレイアウト
  • ソースコードの行数が少なく済むので読み込みが早い

デメリット

  • ブラウザによる表示の違い

 

3種類の書く方法

cssファイルを別にしリンクさせる方法

htmlファイル
<head>
・・・・・ <link rel="stylesheet" href="cssファイルのパス">
・・・・・ </head> cssファイル h1{ color:red; }

styleタグをhead要素に書く方法

<head>
<style>
h1{
  color:red
}
</style>
</head>

インラインと呼ばれるhtml要素に書く方法

<h1 style="color:#red">大見出し</h1>

CSSの基本書式

セレクタ{属性:値}   

  • セレクタ
    CSSを適用するタグ

  • 属性(プロパティ)
    セレクタに対して設定するスタイル。色、文字サイズなど。
     
  • 値  
    属性に対しての値。色が属性なら値は「赤や緑など」。

h1{color:red;}はh1の色を赤にする命令になる。