如何使html标签在<p>中不添加换行符而是尾随空格？
如何使html标签在<p>中不添加换行符而是尾随空格？
提问于 2018-08-01 06:17:01
我有一些文本块要显示在同一行中。我尝试将它们包装起来，这样就不需要在它们之间添加空格。但是，当我尝试<p>时，似乎会换行。有没有办法将其更改为尾随空格，或者使用其他标签来实现目标？
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-08-01 06:19:56
通常，这是通过无序列表元素<li></li>完成的，这些元素包装在<ul></<ul>中并在CSS中设置为display:inline;样式。
然后，您可以根据自己喜欢的间距添加left-margin或right-margin值。
<style>
ul li {
display: inline;
margin-right: 10px;
color: blue;
}
</style>
<ul>
<li>Some Text</li>
<li>More Text</li>
<li>Some More</li>
<ul>
Stack Overflow用户
发布于 2018-08-01 06:18:45
您可以使用 创建不间断的空间
Text Text
还可以使用元素的margin属性设置它与最近元素的距离(有四个margin属性：margin-top、margin-bottom、margin-right和margin-left)。
<span>Text text text</span><span style="margin-left: 30px;">More text more text</span>
您可以使用display: inline-block使元素保持在同一行上。只需更改margin-right和margin-left属性即可调整元素之间的间距。
.square{
width: 50px;
height: 50px;
display: inline-block;
border: 1px solid black;
background-color: dodgerblue;
}<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square" style="margin-left: 300px;"></div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51622885
复制相关文章
相似问题
腾讯云开发者
