【超初心者向け】ハードコーディング(html/css)やってみよう! その4:クラスの追加

ハードコーディングを(html/css)やってみよう!
この記事は超初心者向けに執筆しているので、経験者は回れ右です。

前記事: http://milk-design.net/?p=167

この記事に向いている方

・パソコンが使える小学生
・コーディングに興味があるwebデザイナー

HTMLにクラスを追加しよう。

さて、htmlに【クラス】を追加しましょう。

クラスとは、cssを指定するタグのようなものです。

下記に

・クラスを付けていないpタグ
・クラスを付けているpタグ

・クラスを付けていないaタグ
・クラスを付けているaタグ

4種類を書いてみました。

See the Pen Untitled by asahi_takahashi (@asahi_takahashi) on CodePen.

ルール
■htmlに 【class=”クラス名”】 を追加する
■cssに .クラス名とcss情報を記述する(クラス名の前に . を付けないと反映されません)

クラスを付けなくても、要素(aやpタグ)にcssクラスを追加する事は可能です。

しかし、
【このpタグには別のクラスを指定させたい!】
【このaタグだけボタンのデザインにしたい!】

などが発生します。

そういった時にクラスを活用していきましょう。

次回はcssクラスを設定してリストを作成してみましょう。
ではまた!