最近忙しさが増して、なかなか勉強できていなかった。。。
勉強を続けよう。

CSSとは？

CSS: Cascading style sheets
文字の色やサイズ、レイアウトを指定できる。
HTMLで書かれた構造化された文章のスタイルを指定するための言語

役割分担

HTMLは文書構造。
CSSは見た目。
普及前はHTMLのtableタグを駆使してレイアウトを整理していた。

CSSのルール

セレクター(どこの){プロパティー(何を):値(どうする);
}

h1{
  color:#F0000;
}

h1要素の色を赤色にする

CSS適用方法

インラインで記述

  <body>
        <h1 style="color:#FF0000">はじめてのCSS</h1>
  </body>

内部参照

これで<p></p>が青くなる。
headタグの中に入れるのがポイント

  <head>
        <!-- 内部参照 -->
        <style>
            p {
                color : #0000FF;
            }
        </style>
  </head>
  <body>
        <p>内部参照</p>
  </body>
</html>

外部参照

このHTMLのスタイルシートはこれやで、って指定

<link rel=stylesheet"" href="stylesheets/first.css">

CSSのメリット

複数のページでスタイルの使い回しができること。

優先順位

インライン　＞　内部参照　＞　外部参照

色の指定

三種類あるよ

RGB

赤、緑、青の3つの色を混ぜて、色を表現

#FF(red)00(green)00(blue)

色で直接

red, green, blueみたいな。

ボーダー

これで、特定の要素に枠線をつけられる。その中の背景色も変えられる。

h2 {
    background-color : #2587BD;

    /* border-style: solid;
    border-color: #E2B483;
    border-width: 5px; */
  border: #E2B483 10px solid;

    color: #FFF;
}

セレクター

セレクターの種類

エレメント(要素)セレクター
IDセレクター

# hello{ }

idはページ内でユニークである必要がる。
複数の要素に同じidはつけられない。

クラスセレクター
こんにちは

.hello{ }

CSS一日目