[解決済み] HTMLのdiv要素とspan要素の違いは何ですか？

質問

の使い方を示す簡単な例を教えていただきたいのですが。 <div> と <span> . どちらも、ページのセクションをマークするのに使われるのを見たことがあります。 id または class しかし、どちらか一方を優先する場合があるのか知りたいのです。

どのように解決するのですか？

• div は ブロック要素
• span は インライン要素 .

つまり、意味的に使うには、divはドキュメントのセクションをラップするのに使い、spanはテキストや画像などの小さな部分をラップするのに使うべきであるということです。

例えば

<div>This a large main division, with <span>a small bit</span> of spanned text!</div>

ブロックレベル要素をインライン要素内に配置することは違法ですので、注意してください。

<div>Some <span>text that <div>I want</div> to mark</span> up</div>

...は違法です。

EDIT: HTML5では、いくつかのブロック要素をいくつかのインライン要素の中に配置することができます。MDN リファレンスを参照してください。 ここで を見ると、かなり明確なリストがあります。上記はまだ違法であり <span> はフレージングコンテンツしか受け付けないし <div> はフローコンテンツです。

具体的な例を挙げてくださいとのことでしたので、私のボウリングサイトからの抜粋です。 ボウルSK :

<div id="header">
  <div id="userbar">
    Hi there, <span class="username">Chris Marasti-Georg</span> |
    <a href="/edit-profile.html">Profile</a> |
    <a href="https://www.bowlsk.com/_ah/logout?...">Sign out</a>
  </div>
  <h1><a href="/">Bowl<span class="sk">SK</span></a></h1>
</div>

OK、どうしたんですか？

また、HTML5 には、article、section、nav などの一般的なページ構造を定義する、幅広い新しい要素群が含まれていることに注意してください。

の4.4項を参照してください。 HTML5ワーキングドラフト をリストアップし、その使用法についてのヒントを与えています。 HTML5はまだ作業中の仕様であるため、最終的なものはまだありませんが、これらの要素がどこにも行かないということは非常に疑わしいです。 古いバージョンの IE でこれらの要素を表示するには、javascript を使用する必要があります。 document.createElement これらの要素がソースで指定される前に。この処理を行うライブラリはたくさんあります。 html5shiv .