２行にしたい要素、改行か分割すべきか

質問

質問が漠然としているかもしれません。

例えば、見出しや定義リストの一部（ＴＤ要素）で複数言語での表記を併記したい場合など、文書構造的に単一の要素だが行を分けたい場合

・改行タグをはさんで２行の単一要素にする
・複数の同じ要素に分割しCSSで見た目を操作する

のどちらが望ましいと考えますか。

回答No.7

神崎 渉瑠（@taloo） · ベストアンサー

連続で済みません。

見出しについてですが、
サブタイトル（補足事項）を、行を分けて書きたい場合はいくつかの方法があります。
（すべて文法上はOKです。）

<h1>タイトル - サブタイトルや補足</h1>

<h1>タイトル<br>
- サブタイトルや補足</h1>

<h1>タイトル</h1>
<h2>サブタイトルや補足</h2>

最後の<h1>と<h2>を分ける方法ですが、
本来のHTMLの文法で考えれば、「大見出し」「小見出し」ですので、サブタイトルでなくなってしまいます。

HTML5では、複数の見出しを<hgroup>でひとまとめにする事ができます。

<hgroup>
<h1>タイトル</h1>
<h2>サブタイトル</h2>
</hgroup>

ただ、これでも厳密にはサブタイトルではなくなってしまうと思いますので、私は、以下のいずれかをお勧めします。

<h1>タイトル<span> - サブタイトル</span></h1>

<h1>タイトル<br>
<span> - サブタイトル</span></h1>

あくまで私見ですので、
・「サブタイトル（補足事項）も含めた物が１つのタイトル（<h1>）」 ・・・私の考え方
・「サブタイトル（補足事項）はタイトル（<h1>）ではない、だから<h2>や<p>に分ける」・・・No.3の考え方と思います
のどちらか好きな方を選べばいいと思います。

お礼

※　「教えてｇｏｏ」から閲覧している方向け：全ての補足後、締め切り時にお礼しています。

回答No.４～７をまとめてのお礼になります。
ソースを見直した結果
・一続きの長い文面で、スタイルシートを切った場合でも１要素として見えてほしい場合（補足No.９）
（現行の主要ブラウザは要素を分けると見た目も分離してしまう）
と
・分離していても構わない場合（言語絡みはおおむねこれに該当）
に区別できそうなので、前者は<br>、後者は要素分割する形にしたいと思います。