文本流出div

Question

当文本没有空格 且超过div大小200px它流出宽度定义为200px我把我的代码放在这里http://jsfiddle.net/madhu131313/UJ6zG/ 你可以看到下面的图片 编辑:我想要要转到下一行的文本

Answer 1

这是因为你有一个没有空格的长词.您可以使用自动换行属性来使文本中断:

#w74 { word-wrap: break-word; }

它也有相当好的浏览器支持.请在此处查看相关文档.

Answer 2

使用

white-space: pre-line;

它会阻止文本流出div.它将在文本到达结束时中断文本div.

Answer 3

你应该使用overflow:hidden; 或scroll

http://jsfiddle.net/UJ6zG/1/

或者用PHP你可以缩短长话...

Answer 4

这对我来说很有效：

{word-break: break-all; }

Answer 5

这个技巧对我有用：

{
  word-break: break-all;
  white-space: pre-wrap;
}

空格
断词

Answer 6

您需要将以下CSS属性应用于容器块(div):

overflow-wrap: break-word;

根据规格(源CSS | MDN):

该overflow-wrapCSS属性指定浏览器是否应该单词中插入换行符,以防止文本溢出其内容框.

将值设置为 break-world

为了防止溢出,如果行中没有其他可接受的断点,通常不可破坏的单词可能会在任意点被破坏.

值得一提...

该属性最初是一个非标准且没有前缀的Microsoft扩展名word-wrap,并且由大多数具有相同名称的浏览器实现.它已经被重新命名为overflow-wrap,与word-wrap作为一个别名.

如果您关心旧版浏览器支持它值得指定:

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

防爆.IE9无法识别,overflow-wrap但可以正常使用word-wrap

Answer 7

使用overflow:auto它将在div:)中为您的文本提供一个滚动条.

Answer 8

如果这有帮助。将以下带有 value 的属性添加到您的选择器中：

white-space: pre-wrap;