html中的div、td 、p 等容器内强制换行和不换行的

在网页设计中，我们经常遇到文本显示的问题。比如在一个固定宽度的div中，如何保证文本的正常显示呢？这就涉及到了CSS中的几个重要属性。

对于“你好朋友朋友朋友我为什么不能看到效果啊”这样的文本，如果你想让它在一个宽度为100px的div中显示，但又担心内容过多导致溢出，可以使用overflow:hidden和white-space:nowrap以及text-overflow:ellipsis来实现。这样，当文本超出div的宽度时，多余的内容会被隐藏，同时显示省略号表示有内容被隐藏。

接下来，我们谈谈自动换行的问题。在CSS中，word-wrap和word-break是两个常用的属性。word-wrap:break-word允许长单词在边界处换行，而word-break:break-all则会在任何位置进行断行，包括在单词内部。这对于包含多种语言的文本特别有用。例如，如果一个div的宽度为200px，里面有一个长英文单词“congratulation”，word-break:break-all会将其截断，而word-wrap:break-word则会将整个单词移到下一行。

值得注意的是，不同浏览器对word-break属性的支持程度不同。在某些情况下，可能会导致显示问题。如果遇到这种情况，可以尝试使用white-space:normal来代替word-break属性，以实现文本的自动换行。这样做可以在Firefox和IE等浏览器中都能得到正确的换行效果。但请注意，单词间的空格不能被忽略，否则换行可能不会正常进行。