<p class="hoge">
<dl>
<dt>aiueo</dt>
<dd>kakikukeko</dd>
</dl>
</p>
こういうのHTML構造で、CSS側は
.hoge dt {
font-size:14px;
}
という具合にしたのですが、どうしてもdtにスタイルの指定が効きません。
firebugで見てみたら、
<p class="hoge"></p>
<dl>
<dt>aiueo</dt>
<dd>kakikukeko</dd>
</dl>
という具合で、<dl>以下が<p>の外に出ていました。
これはおかしいぞ、と思い調べてみたら「<p>~</p>の間にはインライン要素しか含めることができない」ということが分かりました。
http://www.tohoho-web.com/html/p.htm
http://www.tohoho-web.com/html/memo/elem.htm
<address> や <blockquote> のように、ブラウザ表示時に前後に改行がはいるものがブロック要素、<big> や <strong> のように、前後に改行がはいらないものがインライン要素と覚えておくと覚え易いでしょう。
とのこと。確かに覚えやすいです。
長いことhtmlを書いてますが、こういうルールがあったとは初めて知りました。
自分もまだまだですね。
[...] 参考情報:http://kawama.jp/archives/2009/05/post_53.html [...]
返信削除