如何在CSS中将多个包含多行文本的p标签放在一起（并排）？

Question

我想要如下的东西：

多个文本可能超过一行，并且在每个

<p></p>

标签结束后有一个形状（圆形），下一个文本从其延续开始。

我尝试为每个元素添加内联样式，但效果不佳！

/*The div tag is related to the circle shape*/

<p style="display: inline">This is a Lorem ipsum</p>
<div style="display: inline"></div>
<p style="display: inline">dolor sit amet</p>
<div style="display: inline"></div>
<p style="display: inline">elit sed do</p>
<div style="display: inline"></div>
<p style="display: inline">eiusmod tempor incididunt</p>
<div style="display: inline"></div>

Answer 1

由于您的 div 是内联元素，因此它将占据内容的宽度。由于内容是空的，因此 div 没有宽度。 将div的显示样式设置为inline-block；另外，添加以下样式进行测试。这对我有用。

 div {
       background-color:gray;
       height:10px;
       width:10px;
       border-radius:5px;
     }