<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 · ベストアンサー

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

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

補足

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

回答No.4

noname#26650

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

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

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

回答No.2

leap_day

こんにちは

他の場所に<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>は必要となっており、記述しております。

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

回答No.1

Oh-Orange

★最初に</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="" は不格好なので
それ以外の方法でないのでしょうか？