我正在设计一个与http://Obvious.com具有相似布局质量的网站（将转移到 Medium）。我注意到他们的布局有一些很棒的地方，有一个方面我不知道该怎么做。
在主页上，当涉及到每篇博文标题下方的文本行时，我看到总是有一个固定的区域，并且文本在文本区域内整齐地排列。此外，如果标题较长，则下面的文字也会相应调整。
这是怎么做到的？我尝试了一种计算字符串中字符数的方法，当标题较长时，选择的字符数量会少 x 个字符……但是这样做时，有时只有一两个单词会挂在下一个单词中因此，线条看起来不均匀。（我不想要不均匀的外观）
那么有没有办法确保文本总是适合行尾？并且文本的数量会根据标题的大小而变化，同时适合吗？
这是一个 PHP 解决方案吗？也许是 CSS？Javascript？（ps这些是我知道我可以使用的语言）
请访问 Obvious.com(trans to Medium) 以供参考。
它只是一个具有一定宽度的css div
<div style="width:300px; height:400px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tempor justo quis urna hendrerit placerat. Ut fringilla rutrum nulla at rutrum. Nullam sagittis accumsan erat et venenatis. Maecenas luctus magna rutrum neque aliquet dictum at quis libero. Mauris at felis dolor. Nam sit amet euismod purus. Etiam tincidunt laoreet dui ut fermentum.</div>
这是我制作的一个 JsFiddle http://jsfiddle.net/RZFYH/
如果查看源代码，您会看到传递给浏览器的文本比实际显示的要多。他们正在做的是返回一篇文章的前 x 个字符（在由 PHP 生成的输出 HTML 中），然后使用 CSS 裁剪容器元素。x 值需要通过反复试验来预先确定，但实际上并没有什么特别的事情发生。
有关CSS 文本剪辑的详细信息，请参阅https://developer.mozilla.org/en-US/docs/CSS/clip和https://developer.mozilla.org/en-US/docs/CSS/text-overflow