spanで一部分のスタイルを変える

spanは一部分のスタイルを変えるのに多用されるタグで、「信号は赤色です。」という文があったとして、”赤色”の文字のみを赤くしたい場合、「信号は<span>赤色</span>です。」のように、spanタグでスタイルを変えたい文字を囲います。

そして、spanに対してCSSを、

1span {
2    color:#f00;
3    }

のように指定します。

サンプルのhtmlのh2に対して、spanを指定してみましょう。spanにはidやclassを指定することも可能です。

1<h2><span class="c1">INFORMATION</span></h2>
2<h2><span class="c1">Lesson1:メモ帳を起動してみよう!</span></h2>
3<h2><span class="c1">Lesson2:タグを書いてみよう!</span></h2>

htmlの編集が終わったら、style.cssを開いて、下のタグを追加します。

1span.c1 {
2    padding-left:10px;
3    }

これで完成です!サンプルはコチラ→サンプル(ホームページ作成講座)

Lesson4~スタイルを細かく指定する~

コメントor補足情報orご指摘あればをお願いします。

(件名or本文内でキーワード検索できます)



  • << 前のページ
  • 次のページ >>