Html 如何避免带有 p 标签的新行？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2076109/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to avoid a new line with p tag?
提问by Josh
How can I stay on the same line while working with <p>tag?
如何在使用<p>标签时保持在同一条线上？
回答by Doug Neiner
Use the display: inlineCSS property.
使用display: inlineCSS 属性。
Ideal: In the stylesheet:
理想：在样式表中：
#container p { display: inline }
Bad/Extreme situation: Inline:
不良/极端情况：内联：
<p style="display:inline">...</p>
回答by Steve Harrison
The <p>paragraph tag is meant for specifying paragraphs of text. If you don't want the text to start on a new line, I would suggest you're using the <p>tag incorrectly. Perhaps the <span>tag more closely fits what you want to achieve...?
该<p>段代码将用于指定文本段落。如果您不希望文本从新行开始，我建议您<p>错误地使用标签。也许<span>标签更符合您想要实现的目标......？
回答by ackushiw
I came across this for css
我为 css 遇到了这个
span, p{overflow:hidden; white-space: nowrap;}
回答by John Boker
something like:
就像是：
p
{
display:inline;
}
in your stylesheet would do it for all p tags.
在您的样式表中会为所有 p 标签执行此操作。
回答by Ronnie Royston
Flexbox works.
弹性盒有效。
.box{
display: flex;
flex-flow: row nowrap;
justify-content: center;
align-content: center;
align-items:center;
border:1px solid #e3f2fd;
}
.item{
flex: 1 1 auto;
border:1px solid #ffebee;
}<div class="box">
<p class="item">A</p>
<p class="item">B</p>
<p class="item">C</p>
</div>