<li><h2>カテゴリ名<h2></li>でh2の文字を小さくしたい

H2の文字を小さくしたいと考えていますが、
スタイルシートでなかなか再現できません。
下記のように設定していますが間違いがありますでしょうか？

xxx.html
<div id="box-cat">
<ul>
<li><h2>カテゴリ名<h2></li>
<li><h2>カテゴリ名<h2></li>
</ul>
</div>

xxx.css
#box-cat {
width:200px;
}

#box-cat h2 {
font-size:11px;
font-weight:normal;
}


お力をお貸し下さい。

No.3 ベストアンサー 回答者： Oh-Orange 回答日時： 2007/03/25 16:09

★そもそも<LI>タグで<H2>タグを使っているのが間違いかもね。

・どうして<H2>タグなの？→<LI>タグにいろいろと記述すればよいのでは？
　下に２つの解決策を載せます。どうぞ。

解決策1:
#box-cat H2{
　MARGIN:0em 0em 0em 2em;　←ここがポイント！
　FONT-SIZE:11px;
　FONT-WEIGHT:normal;
}
※『#box-cat』と『xxx.html』はそのままで良い。

解決策2:
#box-cat2 LI{
　FONT-SIZE:11px;
　FONT-WEIGHT:normal;
}
※『#box-cat』はそのままで良い。

●xxx.html
<UL id="box-cat">
<LI>カテゴリ名
<LI>カテゴリ名
</UL>

・以上です。これで一様、文字は小さくなりました。→私の環境での結果論！

この回答への補足

あ、上記のサンプルでは、h2になっておりました。
<li><h2>は確かに変ですね。
実際のソースでは、<h3>と指定しております。
私の勘違いでした、申し訳ありません。

補足日時：2007/03/25 18:02

この回答へのお礼

<h2>カテゴリ</h2>
<ul>
<li><h3>カテゴリ名</h3></li>
</ul>
は、(X)HTMLのマークアップ記述では間違ってはいないと思うのですが、
中見出し→小見出し。。。やっぱりダメな方向なんでしょうか？
カテゴリ中のカテゴリ名なんで。微妙かな。

上記の方法でも、無事解決することが出来ました。
ありがとうございました。

お礼日時：2007/03/25 18:02

No.4 回答者： noname#26650 回答日時： 2007/03/25 16:44

> これで一様、文字は小さくなりました。

時折見かける誤りですが、「一様」ではなくて「一応（いちおう）」です。

# 他には、「いちよ」なんて書いている人を見かけたこともあります。

No.2 回答者： leap_day 回答日時： 2007/03/25 15:54

こんにちは

他の場所に<h2>がないのであれば・・・

<style type="text/css">
<!--
h2 {
font-size:11px;
font-weight:normal;
}
//-->
</style>

<ul>
<li><h2>カテゴリ名</h2>
<li><h2>カテゴリ名</h2>
</ul>

でいいと思います

他の場所にも<h2>があるのであれば・・・

<style type="text/css">
<!--
.box-cat h2 {
font-size:11px;
font-weight:normal;
}
//-->
</style>

<ul class="box-cat">
<li><h2>カテゴリ名</h2>
<li><h2>カテゴリ名</h2>
</ul>

<h2>カテゴリ名</h2>

とすればO.K.かと思います

<ul id="box-cat">でするなら
.box-cat h2 を #box-cat h2　に（つまりそのままでO.K.)

質問文のでしてもそのままでできてましたけど？(</li>は除いて)

xxx.cssがうまく読み込まれていないのでは？
<link rel="stylesheet" href="xxx.css" type="text/css" />

この回答へのお礼

ご回答ありがとうございます。
説明不足で申し訳ありません。
当方、XHTML1.0、Transitionalでマークアップ記述をしているので、
</li>は必要となっており、記述しております。

上記の方法で再度やってみると出来ました。
ありがとうございました！

お礼日時：2007/03/25 17:57

No.1 回答者： Oh-Orange 回答日時： 2007/03/25 14:16

★最初に</H2>がありません。

・あと</LI>は必要ないのでは？
・<UL>の方に ID を付けてみたらどうかな。→<DIV></DIV>は必要なくなるよ。

●xxx.html
<UL id="box-cat">
<LI><H2>カテゴリ名</H2>
<LI><H2>カテゴリ名</H2>
</UL>

・『xxx.css』は問題ないと思うよ。
・以上。おわり。

この回答へのお礼

大先生ありがとうございます。
あ、</li>は急いで書いて忘れていました。
マークアップにはミスはありません。

なるほど。ulにidを指定するのですか。
やってみましたが、やはりムリでした。（チクショー；
さすがに、h2 calss="" は不格好なので
それ以外の方法でないのでしょうか？

お礼日時：2007/03/25 14:23