|
 |
|
定義済みのスタイルを適用させるための属性
解説
あらかじめ、ID名やクラス名を指定してスタイルを定義しておき、それをid属性やclass属性で指定した要素だけに適用することができます。
id属性はそのHTMLファイル内で１つの要素にしか適用することができませんが、class属性は同じものを複数の要素に対して指定することができます。
#ID名の前に要素名(BODY,TABLEなど)を書くと、指定した要素に対してのみ有効なID名を定義することができます。
これはクラス名の場合も同様です。
スタイルシート・サンプル
緑の文字が変更箇所で、赤い文字が対応するスタイルシートです。
"/* */"内はコメントです。削除しても影響ありません。
必要な箇所をコピー＆貼り付けして編集してください。
<HTML>
<HEAD>
<TITLE></TITLE>
<STYLE type="text/css">
<!--
H1#sample_id_1 { background-color: #ffff99 } /* id属性 */
#sample_id_2 { background-color: #0000aa } /* id属性 */
TD.sample_class_1 { background-color: #ff0000 } /* class属性 */
.sample_class_2 { background-color: #00ff00 } /* class属性 */
-->
</STYLE>
</HEAD>
<BODY id="sample_id_2">
<H1 id="sample_id_1">見出しです</H1>
<TABLE border="5" class="sample_class_2">
<TR>
<TD class="sample_class_1">aaa</TD>
<TD class="sample_class_1">bbb</TD>
</TR>
<TR>
<TD class="sample_class_1">ccc</TD>
<TD class="sample_class_1">ddd</TD>
</TR>
</TABLE>
</BODY>
</HTML> |
注意点など
← スタイルシートに戻る
|
|
|
