質問が示すように、HTMLに追加したいテキストがある場合<p>、いつ使用する必要があり、いつ使用する必要があります<span>か?
回答:
HTMLは、HTMLに含まれるコンテンツを説明することを目的としていることに注意してください。
したがって、段落を伝えたい場合は、そうしてください。
しかし、あなたの比較は正確には正しくありません。より直接的な比較は
?の
<div>代わりに使用する場合<p>
どちらもブロックレベルの要素であるため。
A<span>はインラインであり、アンカー(<a>)<strong>、、強調(<em>)などによく似ています。したがって、htmlとネイチャーライティングの両方でのデフォルトの性質により、段落は、<div>。
場合によっては、物事(インライン物)をスタイリングするときに<span>、cssを「フック」するための何かを提供するのに最適ですが、それ以外の場合は、セマンティックまたはスタイルの意味がない空のタグです。
pしspanます。段落では、パディングはすべての行(テキストのブロック)に影響しますが、スパンでは最初の行にのみ影響します。
<p>タグはparagraph、そのようなものとして、それは、ブロック(例えば、ある、等の元素h1とdiv)一方、spanインライン要素である(例えば、として、bとa)
デフォルトでは、ブロック要素はその上下に空白を作成し、float属性を設定しない限り、ブロック要素の横に何も配置できません。
インライン要素は、段落内のテキストのスパンを処理します。通常、マージンはありません。そのため、たとえば、にマージンを設定することはできませんwidth。
スパンは完全に非セマンティックです。それは意味がなく、単に美容効果の要素として機能します。
段落には意味的な意味があります。つまり、カプセル化するコンテンツがテキストのブロックであり、本のテキストの段落と同じ意味を持つことをマシン(ブラウザやスクリーンリーダーなど)に伝えます。
実用的な説明:デフォルトで<p> </p>は、囲まれたテキストの前後に改行が追加されます(したがって、段落が作成されます)。<span>これを行わないため、インラインと呼ばれます。
pタグは、段落要素を示します。マージン/パディングが適用されています。スパンは、スタイルが設定されていないインラインタグです。重要な違いは、スパンがインラインの場合、pはブロック要素であるということです。つまり<p>Hi</p><p>There</p>、<span>Hi</span><span>There</span>並べて巻き上げると、異なるラインに表示されます。
tagはブロックレベルの要素ですが、tagはインライン要素です。通常、ブロック要素内のスタイルを設定するためにスパンタグを使用します。ただし、スタイルをインライン化するためにスパンタグを使用する必要はありません。「display:inline」を使用してブロック要素をインライン要素に変換します
p必ずしも周囲の改行でスタイリングされない場合があり、例えば、それは、インラインで続くことができる段落記号のシンボル。「インライン」および「ブロック」という用語も、目の不自由なユーザーには何の意味もありません。むしろ、フローコンテンツとフレージングコンテンツを区別してください(このリンクを参照)。