ホーム  >  ネット起業、アフィリエイト、eBOOK作成、メルマガ発行の体験談  >  CSSアクセスアップ CSSの基本 定義方法

CSSアクセスアップ CSSの基本 定義方法

CSSアクセスアップ CSSの基本 定義方法


■CSSは下記の3つを組み合わせます。

セレクタ  = スタイルを定義する要素
プロパティ = スタイルの種類
値     = スタイルの種類つまりプロパティに変化をもたらします。


■例、区切り線を緑色にするCSSの定義文

HR { COLOR : GREEN ; }

セレクタ  → HR    区切り線を示す、HTMLの要素
プロパティ → COLOR  区切り線の色
値     → GREEN  プロパティ=COLOR(色)を緑色にする。

■主なセレクタ

HTMLでページ作成をされた方なら、すでにお分かりでしょう。
タグ <>で囲まれた、要素(element)と同じものです。

H1 <H1> ~ </H1>  見出しの要素を囲んだタグ。H要素にはH1からH6まであります。
P  <P> ~ </P>   段落の指定、要素を囲んだタグ。その他、
DIV <DIV> ~ </DIV>
SPAN <SPAN> ~ </SPAN>


■使い方の例。
CSSの定義 → H1 { COLOR : GREEN ; }
HTMLの記述 → <H1>CSSの使い方を説明するページです。</H1>

と、記述しますと、大見出しの文章の文字色が緑色(GREEN)で表示されます。


さらに重要なセレクタとしては、下記のようなものがあります。
BODY
TABLE
TR
TD
A

■使い方の例。
CSSの定義 → BODY { BACKGROUND-COLOR : GREEN ; }

HTMLの記述

  ↓

<BODY>

  --ブラウザに表示される内容。ページ全体--
  --ここに、サイトのHTMLを記す。--

</BODY>


この例では、ページ全体の背景色が 緑色(GREEN) に設定されます。

セレクタ  → BODY   ページ全体を示す、HTMLの要素
プロパティ → BACKGROUND-COLOR  背景の色
値     → GREEN  プロパティ=BACKGROUND-COLOR(背景色)を緑色にする。