清除内联块

Question

如何清除内联块？

这是我的HTML：

<p>Text 1</p>
<p>Text 2</p>
<p class="third">Text 3</p>
<p>Text 4</p>

我的css使每个p标记成为一个内联块，用于布局，样式，边距和填充目的。

对于响应式布局，我现在需要Text 3清除到下一行，而Text 4则需要它。所以在我这之前：

文字1文字2文字3文字4

但现在我需要这个：

文字1文字2

文字3文字4

UPDATE - 是否有一个解决方案，以确保添加额外的HTML标记？

Answer 1

您可以使用：

<p>Text 1</p>
<p>Text 2</p>
<div class="clear"></div>
<p>Text 3</p>
<p>Text 4</p>

在CSS中：

.clear{
   clear: both;
}

Answer 2

你可以使用这个css。

   p{
    float:left;
    margin-right:3%   /*For spacing on between paragraph*/
}
.third{
    clear:left;
}