• ベストアンサー

aの中にspan

aの中にspan spanの中にa どちらが正しいですか? <a class="eee" href="http://a.com/"> <strong class="eeee">ホーム</strong> <span class="eeeee">HOME</span> </a> は正しいですか?

質問者が選んだベストアンサー

  • ベストアンサー
  • weakweak
  • ベストアンサー率34% (350/1003)
回答No.1

a も span もインライン要素であり、どちらもインライン要素とテキストを内包できますので、文法的にはどちらも正しいかと思います。 ただ、spanは意味を持たないインライン要素で、目的が文章をグループ化することなので、特別な理由がない限りspanの中にaが来るのが正しいといえると思います(aに文章をグループ化するという目的はないのにspanを内包してグループ化するのはおかしいし、そもそもspanがグループ化してくれている文章をさらにaでグループ化するとなると意味が2重になってしまい不自然)。

すると、全ての回答が全文表示されます。

その他の回答 (2)

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.3

 A要素は行内要素で、その内容も行内要素でなければなりません。HTML5ではブロックも条件付で含めることが出来ます。ただし、いずれも必ずブロック要素の中になければなりません。  ただ、例にあげられたマークアップは感心しないところがいくつかあります。 classは、あくまで、その要素の文書構造を示すために使用します。また他に適当な要素がある場合はそれを使います。 この場合は <a href="[URI]"><span lang="jp">ホーム</span><span lang="en">HOME</span></a> とか <a href="[URI]"><span title="HOME">ホーム</span></a> でよいのではないかと・・ ※A要素のclassは不要でしょう。href属性の値で区別できますから・・

すると、全ての回答が全文表示されます。
  • hirotn
  • ベストアンサー率59% (147/246)
回答No.2

xhtml1.0 strict の文書定義(DTD)によると、 <!ELEMENT span %Inline;> <!ENTITY % inline "a | %special; | %fontstyle; | %phrase; | %inline.forms;"> <!ELEMENT strong %Inline;> <!-- strong emphasis --> <!ENTITY % phrase "em | strong | dfn | code | q | sub | sup | samp | kbd | var | cite | abbr | acronym"> <!ELEMENT a %a.content;> <!ENTITY % a.content "(#PCDATA | %special; | %fontstyle; | %phrase; | %inline.forms; | %misc;)*"> <!ENTITY % special "br | span | bdo | object | img | map"> いずれも問題は無いようです。 振り返れば、 <a href="foo.bar">this is <span style="color: red;">NOT</span> a pen.</a>とかやりそうです。 また、 ENTITY a.contentをみると、*があるのでaの中に2つ以上要素(今回はstrongとspan)があってもよいです。 ただし、太字にするためにstrongを使用するのは間違っています。

すると、全ての回答が全文表示されます。

関連するQ&A