使用CSS根据父容器的静态宽度强制一长行文本(不带空格)换行

Question

可能重复：
CSS：我如何强制一个长字符串（没有任何空白）包装在XUL和/或HTML 中

假设有以下代码：

<div style="width:100px;height:1000px">This-is-a-long-line-of-text-without-any-spaces-This-is-a-long-line-of-text-without-any-spaces-This-is-a-long-line-of-text-without-any-spaces-This-is-a-long-line-of-text-without-any-spaces</div>

我很抱歉，但堆栈溢出（根据预览）不会换行代码片段。

在大多数（？）情况下，以下情况将导致容纳长文本行的容器拉伸到其中包含的文本的全宽。

我们想根据父容器的css指定宽度（宽度：100px）强制换行（甚至是单词中间）。

这可能是通过一个我不知道的css标签实现的吗？

IE6+可比性，加上壁虎/网络工具包/歌剧。

Answer 1

现代（CSS3）答案，现在适用于所有浏览器：

.wrap {
  overflow-wrap: break-word;
}

请注意，您可能需要将overflow:hidden和/或width:100%添加到父元素/祖先元素中。

---

老答案：

.wrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}

Answer 2

word-wrap和word-break的组合可能会为您解决此问题。请参阅如何在DIV中的loooooong单词中强制换行？（可能的重复）