スタイルシート(CSS)レイアウト

Home>スタイルシート(CSS)について目次>スタイルシートの定義について

スタイルシートの定義について

classセレクタ

前項【スタイルシートの記述】で外部スタイルシートの作成が出来たと思いますが、今の状態はすべてのページのすべてのタグに適用されている形です。 ホームページをつくっていく上で、【ある一部分は●●したい】とか【すべてのページにおいてこの部分は●●したい】等が出てくると思います。

そのような時に使うのが下記【スタイルシートクラス】です。

HTML側

<タグ class="クラス名">〜</タグ>

css側

.クラス名

クラス名は任意です。

idセレクタ

また【id】<タグ id="id名">〜</タグ>もありますが、こちらはページ内に一度しか使用できません。利用方法としてはレイアウトを決める際に使用します。（当サイトのレイアウトにも使用）

指定サンプル

例えば、ある一部分だけ色を青くしたい場合（前項で利用したcssファイルを利用してます）

クラス名は【.blue】としました。


a{
text-decoration: none;
color: red;
}
a:hover{
text-decoration : underline;
}
.blue{
color: blue;
text-decoration: none;
}
-----------------------------------
<ul>
<li><a href="●●.html">リンク</a></li>
<li class="blue"><a href="●●.html">リンク</a></li>
<li><a href="●●.html">リンク</a></li>
</ul>

▲このpageの上へ|目次へ

Home