html - 为段落添加空白填充

Question

我试图将段落中的字符数限制为特定数字。如果文本小于这个，那么我想用空格填充它，如果它更长，那么我会用省略号截断它。我希望所有包含段落的容器都具有相同的大小。

我正在使用响应式网格，因此我的容器将根据段落的长度动态调整大小。我已经尝试向 p 元素添加预包装，但我的 div 不会调整大小。它似乎仍然忽略了添加的空格。

p
{
white-space:pre-wrap;
}

这是一个显示我的情况的 JSFiddle：http: //jsfiddle.net/RFBza/4/

score 0 · Accepted Answer

我的天啊。但是，如果您出于某种原因希望完全这样做，请尝试添加一堆 除以空格的代码。所以，在你添加五个空格的地方，现在添加     . 但当然，这仍然是一个糟糕的主意。

score 0 · Accepted Answer

white-space并不意味着“加长”任何 div 或添加填充以填充空间。它仅用于确定措辞如何包装在包含的 div 中。例如，如果您希望该文本溢出 div，您可以使用white-space

现在，如果你试图实现它们看起来都相似，那么快速而肮脏的方法是为包含的 div 添加一个最小高度。

这样做的问题是您的措辞会不断变化，因此实际高度可能会发生变化（就像您说的那样，它是响应式的，因此当您调整大小时，这也将不再起作用）

还有其他几种技术可以达到这种预期效果，但它们都需要一些 JQuery、一些标记更改，甚至是 PHP（如果你想要一个字符串只有这么多字符，否则显示省略号）等等......

您甚至可以将其添加到pCSS 中的选择器中，但要小心，因为这将适用于每个单独的段落。也许你可以使用更多的选择器来获得具体的信息。

p
{
   white-space:pre-wrap;
   min-height:192px
}

此外，使用 PHP 确定长度并在超过该长度时显示省略号。在本例中，为 50 个字符。

echo mb_strimwidth("Your paragraph goes here", 0, 50, '...');

2 回答 2