<span> vs <div> vs <Fragment>

Question

我对列出的元素感到困惑。

我已经知道的是：

1. 它们都没有真正的意义。

2. 片段不是真正的元素。

您能解释一下它们之间的主要区别是什么吗？我们什么时候应该选择一个而不是另一个？

Answer 1

我不确定<fragment>，但可以说出<div> 和<span> 的区别。

<span> 和 <div> 之间的区别在于 <span> 元素是内联的，通常用于一行内（例如段落内）的一小部分 HTML，而 <div> (除法）元素是块行（基本上相当于在它之前和之后有一个换行符），用于对更大的代码块进行分组。

<div> 示例：

<div style="background-color:black;color:white;padding:20px;">
  <h2>London</h2>
  <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>

<span> 示例：

<h1>My <span style="color:red">Important</span> Heading</h1>

最后一个例子是当你使用

<div>Hello</div>
<div>World</div>

给出这个：

你好
世界

<div> 在每个元素之间换行，因为它是块级元素，而<span> 没有：

<span>Hello</span>
<span>World</span>

你好世界