スタイルシートでクラスを設定する
同じタグに何種類もの属性をつける場合、そのタグに名前(class)をつけます。
以下のように同じフォルダ内にtest.cssとtest.htmというファイルを作ります。
ファイル名：test.css
body { background-color:#cccccc }
table.blue { background-color:#0000FF }
table.red { background-color:#FF0000 }
|
【説明】
<table>に指定したclassが"blue"なら、background-colorを#0000FFにする。
<table>に指定したclassが"red"なら、background-colorを#0000FFにする。
ファイル名：test.htm
<html>
<link rel="stylesheet" type="text/css" href="test.css">
<body>
<table class="blue">
<tr><td>class="blue"で背景色を青色に設定しています。</td></tr>
</table>
<table class="red">
<tr><td>class="red"で背景色を赤色に設定しています。</td></tr>
</table>
</body>
</html>
|
正しく表示されましたか？
<table>に指定したclassは、どのような名前でもOKです。
使いやすい名前を付けましょう。
 サンプル
関連リンク
スタイルシートとは
スタイルシートの作り方
スタイルシートで使用できる属性
スタイルシートで複数の属性を設定する
スタイルシートで動きをつける(1)
スタイルシートで動きをつける(2)
スポンサードリンク
| |
