8

重複の可能性:
HTML タグの DIV と SPAN の違いは何ですか?

<em>HTML をコーディングするときは、セマンティクスを念頭に置いておく必要があることを知っています。たとえば、h1 はメイン ヘッダーにする必要があり、h2 はサブヘッダーにする必要があります。テーブルはテーブルにする必要があります<i>。一方がブロックで、もう一方がインラインであることを除いて、divとスパンの適切な違いは?

私が学んでいたとき、 は<span>テキストのミッドラインをスタイリングするためのものだと言われました。Web ページの特定のポイントに配置する必要がある小さなテキストの宣伝文句 (タグを保証しないもの) がある<p>場合、div に固執する必要がある場合、スパンを使用しますか? テキストしか含まれていない場合、そのテキストが 2 行にまたがる必要がある場合 (つまり、幅が必要な場合)、何を使用すればよいですか?

4

7 に答える 7

9

意味的には、本質的な意味はありませ<div>ん。<span>それらは、既存のタグが実際に適合しないもので使用されることを意図した「キャッチオール」タグです。セマンティクスを気にする場合は、最後の手段として div と span を使用してください。

それらの唯一の違いは、div はブロック レベルの要素であり、span はインラインであることです。つまり、デフォルトでは、div はまったく新しいブロックを開始し、技術的にはインライン要素と特定の CSS のみがスパン内で許可されます。ほとんどのブラウザーは、ルールに関係なくタグを処理するようです (「タグ スープ」を想定)。実際には、CSS を使用してどちらか一方を他方のように動作させることができますが、検証やブラウザー間の互換性を気にする場合は、そのいずれも行わないでください。 （あなたはどちらを気にしますか？）。

于 2010-06-02T22:00:34.973 に答える
7

スパンと div の主な違いは、スパンがインライン要素であるのに対し、div はpまたは段落要素のようなブロック要素であることです。だから、要するに

span { display: block; }

基本的にすべてのスパンをdivに変えています。エフェクトやパディングなどを適用するなど、テキスト行だけにスパンを使用します。div は通常、Web ページを分割するためのものです。そのため、テキストをどこかに配置する必要がある場合は、div を使用することをお勧めします。

于 2010-06-02T21:57:48.663 に答える
5

Div は分割ブロック、span はインライン テキストのスパンです。

したがって、Div は高さと幅を持つボックス/ブロックであり、スパンはインラインです。基本的。

仕様を読みたい場合は、ここにリンクがあります。

DIV および SPAN 要素は、id および class 属性と組み合わせて、ドキュメントに構造を追加するための一般的なメカニズムを提供します。これらの要素は、コンテンツをインライン(SPAN) またはブロックレベル(DIV) として定義しますが、コンテンツに他の表現方法を課すことはありません。したがって、作成者はこれらの要素をスタイル シートや lang 属性などと組み合わせて使用​​し、HTML を自分のニーズや好みに合わせることができます。

于 2010-06-02T21:57:11.087 に答える
3

<span><div>どちらも非常に一般的な要素です。それ自体では、意味がありません。

主な違いは<span>、インライン要素であることです。つまり、次のようなものがある場合:

<span>Some text.</span> Some other text

新しい行に「その他のテキスト」はありません。スパンを (ブロック要素) に置き換えた場合<div>、改行が発生します。インライン要素内にブロック要素を含めるのは適切な構文ではないことに注意してください。したがって、<span>の中に を入れることはできますが<div>、その逆はできません。

詳細については、こちらを参照してください。

ウィキペディア - スパンと div

About.com - スパン vs. div

于 2010-06-02T22:00:03.057 に答える
2

基本的な違いがあります。<div>はブロック レベル要素ですが、<span>はインライン要素です。違いは、ブロック レベル要素は改行で開始および終了し、インライン要素は改行しないことです。

おそらくさらに重要なのは、HTML のバージョンによって、ブロック要素とインライン要素内で有効な他の要素について異なる規則があることです。

于 2010-06-02T22:02:23.837 に答える
1

あなたはそれを手に入れました。Span = インライン、Div = ブロック。それで全部です。

テキストの宣伝文句に独自のレイアウトが必要な場合 (画面のどこかに配置したい場合)、それは div です。

テキストの宣伝文句が、すぐ隣にある他のテキストのレイアウトに関与している場合、それはスパンです。

インライン要素は独自のレイアウトを持つことはできません。その場合、インラインにはなりません。

于 2010-06-02T22:04:41.693 に答える
1

では、すばやく簡単に答えるために、DIV は分割です。目標は、特定の要素をグループとして扱う必要がある場合に使用することです!

例: div を使用してログイン パネルを表示します。たとえば、画面の左側に非表示にして、マウスを div に合わせると表示されます :)

于 2010-06-02T21:58:49.927 に答える