HTML如何仅给active文字设绿色背景且保持内容单行显示

代码出现换行的核心原因是<p>是块级元素，浏览器默认会让块级元素独占整行、前后自动换行，因此"active"部分会被挤到下一行，不符合同行显示的要求。

给行内的局部文本添加样式，优先用行内标签<span>，它默认不会触发换行，是这类场景的标准写法：

• 基础版（仅满足两个核心要求：同行显示、active带绿色背景）

Jane Smith <span style="background-color: green;">active</span>

• 优化版（匹配参考效果的标签视觉，补充文字颜色、内边距、圆角属性）

Jane Smith <span style="background-color: green; color: white; padding: 2px 6px; border-radius: 3px;">active</span>

如果一定要沿用<p>标签实现，只需给它加display: inline样式强制改为行内显示即可，但这种写法的语义合理性不如span，示例代码：

Jane Smith <p style="background-color: green; display: inline;">active</p>

内容的提问来源于stack exchange，提问作者python developer