blocks|key|1817839|text|从语义上讲，您可以使用标记来指示段落。用于将CSS样式和/或类应用于文本和内联元素的任意部分。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1817840|entityMap^0|B|3|M|6|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

Semantically, you use <code>&lt;p&gt;</code> tags to indicate paragraphs. <code>&lt;span&gt;</code> is used to apply CSS style and/or class(es) to an arbitrary section of text and inline elements.

blocks|key|1817856|text|从语义上讲，p是一个段落标签，应该用来设置文本段落的格式。span是一种非语义处理的内联格式更改。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1817857|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Semantically speaking, a p is a paragraph tag and should be used to format a paragraph of text. A span is an inline formatting change that isn't handled semantically.

blocks|key|1817875|text|Span完全是非语义的。它没有任何意义，只是起到了装饰效果的作用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1817876|段落具有语义含义-它们告诉机器(如浏览器或屏幕阅读器)它们封装的内容是文本块，并且具有与书籍中的文本段落相同的含义。|1817877|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

Span is completely non-semantic. It has no meaning, and serves merely as an element for cosmetic effects.

Paragraphs have semantic meaning - they tell a machine (like a browser or a screen reader) that the content they encapsulate is a block of text, and has the same meaning as a paragraph of text in a book.

blocks|key|2031407|text|一个实用的解释:默认情况下，+会在封闭的文本前后添加换行符(因此它会创建一个段落)。不能做到这一点，这就是为什么它被称为内联。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2031408|entityMap^0|E|8|1D|6|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

A practical explanation: By default, <code>&lt;p&gt; &lt;/p&gt;</code> will add line breaks before and after the enclosed text (so it creates a paragraph). <code>&lt;span&gt;</code> does not do this, that is why it is called inline.

blocks|key|1817951|text|跨度是没有上下换行符的内联格式元素。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1817952|P是一个块元素，上面和下面都有一个隐含的换行符。|1817953|http://w3schools.com/tags/default.asp|offset|length|1817954|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|0|11|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|Q|8|@]|9|@$F|R|G|S|1|T]]|A|$]]|$1|H|3|-4|5|6|7|U|8|@]|9|@]|A|$]]]|I|$J|$5|K|L|M|A|$N|E]]]]

A span is an inline formatting element that does NOT have a line feed above or below.

A p is a block element that HAS an implied line feed above and below.

<a href="http://w3schools.com/tags/default.asp" rel="noreferrer">http://w3schools.com/tags/default.asp</a>

blocks|key|2031470|text|标签是p参数，因此，它是块元素(例如，h1和div)，而span是内联元素(例如，b和a)|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2031471|缺省情况下，块元素会在其自身的上方和下方创建一些空格，除非为它们设置了float属性，否则不能在它们旁边对齐任何内容。|2031472|内联元素处理段落中的文本跨度。它们通常没有边距，因此，例如，您不能为其设置width。|2031473|entityMap^0|0|3|6|1|M|2|P|3|V|4|18|1|1A|1|0|Z|5|0|11|5|0^^$0|@$1|2|3|4|5|6|7|L|8|@$9|M|A|N|B|C]|$9|O|A|P|B|C]|$9|Q|A|R|B|C]|$9|S|A|T|B|C]|$9|U|A|V|B|C]|$9|W|A|X|B|C]|$9|Y|A|Z|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|10|8|@$9|11|A|12|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|13|8|@$9|14|A|15|B|C]]|D|@]|E|$]]|$1|J|3|-4|5|6|7|16|8|@]|D|@]|E|$]]]|K|$]]

The <code>&lt;p&gt;</code> tag is a <code>p</code>aragraph, and as such, it is a block element (as is, for instance, <code>h1</code> and <code>div</code>), whereas <code>span</code> is an inline element (as, for instance, <code>b</code> and <code>a</code>)

Block elements by default create some whitespace above and below themselves, and nothing can be aligned next to them, unless you set a <code>float</code> attribute to them.

Inline elements deal with spans of text inside a paragraph. They typically have no margins, and as such, you cannot, for instance, set a <code>width</code> to it.

blocks|key|1818031|text|P标记表示段落元素。它应用了边距/填充。跨度是一个未设置样式的内联标签。一个重要的区别是，当span是内联的时候，p是一个块元素，这意味着当HiThere并排上发条时，HiThere会出现在不同的行上。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1818032|entityMap^0|1Y|X|32|L|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

The p tag denotes a paragraph element. It has margins/padding applied to it. A span is an unstyled inline tag. An important difference is that p is a block element when span is inline, meaning that <code>&lt;p&gt;Hi&lt;/p&gt;&lt;p&gt;There&lt;/p&gt;</code> would appear on different lines when <code>&lt;span&gt;Hi&lt;/span&gt;&lt;span&gt;There&lt;/span&gt;</code> winds up side by side.

blocks|key|1818068|text|是内联标签，是块标签，用于段落。浏览器将在段落下方呈现一个空行，而将呈现在同一行上。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1818069|entityMap^0|0|6|C|3|16|6|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]|$9|M|A|N|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|O|8|@]|D|@]|E|$]]]|G|$]]

<code>&lt;span&gt;</code> is an inline tag, a <code>&lt;p&gt;</code> is a block tag, used for paragraphs. Browsers will render a blank line below a paragraph, whereas <code>&lt;span&gt;</code>s will render on the same line.

blocks|key|1818091|text|当我们使用普通文本的时候，我们想要+tag.when，我们使用的是带有一些效果的普通文本，我们想要标签|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1818092|entityMap^0|H|3|1G|6|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

When we are using normal text at that time we want <code>&lt;p&gt;</code> tag.when we are using normal text with some effects at that time we want <code>&lt;span&gt;</code> tag

blocks|key|1818102|text|p+{
++++float:+left;
++++margin:+0;
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1818103|周围没有间距，它看起来类似于span。|unstyled|1818104|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>p {
 float: left;
 margin: 0;
}
</code></pre>

No spacing will be around, it looks similar to span.

blocks|key|2031627|text|解释|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2031628|P元素是块级的，因此，在行/文本前后添加填充和边距。但span是内联元素，因此不会在行前后添加任何填充和边距。我们实际上使用span元素来设置样式，它在HTML中没有语义，但是p元素是块元素，在HTML中有语义。|2031629|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

Explanation
p element is a block level, therefore, add padding and margin before and after the line/ text. But span is inline element and therefore does not add any padding and margin before and after the line. We actually use span element for styling purpose and it has not semantic meaning in HTML, however, the p element is block element and has semantic meaning in HTML.

As the question indicates, if I have some text that I want to add in the HTML then when should I use <code>&lt;p&gt;</code> and when should I use <code>&lt;span&gt;</code>?

When to use instead ?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

如问题所示，如果我想在超文本标记语言中添加一些文本，那么什么时候应该使用，什么时候应该使用

问什么时候用<span>代替<p>？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问什么时候用<span>代替<p>？EN