在CSS中换行长文本

Question

我有这样的文本

<div style="float:left; width: 250px"> PellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesquePellentesque  feugiat tempor elit. 
Ut mollis lacinia quam. Sed pharetra, augue aliquam   ornare vestibulum, metus massalaoreet tellus, eget iaculis lacus ipsum et diam. </div>

我不想要水平滚动。是否可以换行(自动换行)。我知道有一些IE特有的属性。

谢谢您抽时间见我。

更新:我也可以使用jQuery，Javascript，PHP来做这件事。但是怎么做呢？我的意思是字母(字体)并不是固定的宽度，或者诸如此类的东西。

Answer 1

我使用组合键

word-wrap: break-word;
overflow: hidden;

来处理这件事。word-wrap设置将允许在支持该属性的浏览器中对单词进行换行，而overflow设置将导致它在不识别word-wrap的浏览器中的可用空间末尾被截断。这是你在不使用javascript的情况下可能得到的最优雅的降级。

Answer 2

根据http://www.w3.org/TR/css3-text/#word-break0的说法

word-break: break-all;

...does与自动换行(现更名为overflow-wrap)的功能不同，因为即使是很小的单词在行尾也可能会断开。但它是有效的。

在极少数情况下，hyphen: auto;可能会给你带来更好的结果，但前提是浏览器使用的词典中包含了你的长词。

Answer 3

作为对Duroth答案的扩展，您可以使用以下php代码插入shy-hyphens

$longest_length = 15;

$string_with_long_word = 'short lonngerrrrr lonnnnnnnggeeeeeeeeeeeeeeeeeessssssssssssssssstttttttttttttt and another looooooooooooonnnnnnnnngwwooooooooororoooorrrrrd';
$string = preg_replace_callback("/[a-z0-9]{{$longest_length},}/", 'putShyHyphen', $string_with_long_word);

function putShyHyphen($matches) {
 $string = $matches[0];
 $newstring = '';
 for ($i=0; $i<strlen($string); $i++) {
  $newstring .= $string[$i] . '&shy;';
 }

 return $newstring;
}
echo $string_with_long_word . '<hr />';
echo $string;