動画で練習３

参考動画

初心者でもわかるHTML&CSS講座　第3回CSSの基本 - YouTube

 ブログ

初心者でもわかるHTML&CSS講座　第3回CSSの基本 | Inoma Create

※ブログ内に学習用のデータがありました。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

ＣＳＳの基本

css=htmlを装飾する仕組み

<htmlコード>=文章に意味を与える（構造化）

<cssファイル>=タグのファイルをまとめたファイル(htmlにスタイルを指定する）

cssの基本書式

h2

   {

     color:#fffff;

     font-size:28px;

   }

• h2=セレクタ

•  {

       color:#fffff;

       font-size:28px;＝宣言ブロック

     }

•  font-size＝プロパティ名
• 28px＝プロパティ値

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

colorプロパティ

XX

  {

    color:#0000ff;

  }

• #0000ff;=カラーコード（ＲＧＢ）

↑「レッスン３」の「０１」データを読み込みます。

↑「css」適用前

 ↑「css」コードを入力

↑Googleチャームで読み込み、成功しました。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

font-sizeプロパティ

xx

   {

     font-size:48px;

  }

• 48px=フォントサイズを指定

↑赤枠が自分で入力した所です。

↑成功、適用されました。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

list-styleプロパティ

コード

xx

{

  list-style: none;

}

• none=リストスタイルを指定

↑「none」指定で「・」が消えました。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

background-colorプロパティ

コード

xx

{

   background-color: #0000ff;

}

• #0000ff=カラーコード

 ↑コード入力

↑一番下の部分を修正しました。