0

我想在表格的单元格中填充一些文本，我的数据是这样的

object1 -> object2 -> object3 ....................-> objectn

我不想随着对象的数量增加单元格大小，而是想用单元格正确包装它。

我为此目的使用这个 .css 片段

.cellbreak {
  max-width: 300px;
  white-space: normal; /* css-3 */
  white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  word-wrap: break-word; /* Internet Explorer 5.5+ */
  overflow: hidden;
  display: inline-block;
}

但问题是，我的文字毫无意义地断了，我的意思是我的输出是这样的

object1 -> object2 -> obje
ct3 -> object4 ->object5 -
> object6 -> object7 ->obj
ect

但我希望我的输出是这样的

object1 -> object2 -> object3 ->
object4 -> object5 -> object6 ->

如何修改我的 css 以获得理想的输出。

注意：我已经在 stackoverflow 中看到了一些帖子，但我没有得到任何与我的问题相关的信息。

提前致谢

4

4 回答 4

1

摆脱word-wrap: break-word;

如果您max-width为元素指定 a （如您所愿），则里面的文本应该正常换行。

于 2013-08-20T17:58:26.620 回答
0

您需要确定“正确包装”的含义，即允许哪些换行点，然后使用允许或禁止换行的各种方式来实现这一点。

假设在这种情况下每个“objectk ->”应该保持在一行，那么你可以使用

<style>
.nobr { white-space: nowrap }
</style>
<span class=nobr>object1 -></span> <span class=nobr>object2 -></span>
<span class=nobr>object3</span> ....................-> <span class=nobr>objectn</span>

如果在行首也允许使用“->”，那么您需要更多这些span元素。

在一般情况下，没有本质上更简单的方法（除非您发现使用了<nobr>...</nobr>而不是<span class=nobr>...</span>，更短一点，更健壮一点，但声明为非标准）。用不间断空格 ( &nbsp;) 替换空格可能看起来有点简单，但它只适用于简单的情况。例如，浏览器仍然可以在各种特殊字符之后或之前中断，甚至可能将“>-”分成两行。（您可以改用箭头字符“→”来避免这个特定问题，出于其他原因，这也可能是一个好主意。）

于 2013-08-20T20:06:17.727 回答
0

尝试添加到你的风格

word-break: normal;

这个属性不会在中间打断单词。

于 2013-08-20T17:59:22.337 回答
0

从 CSS 中删除所有空白、字流和溢出语句，因为它没有按照您的预期进行。只需将对象名称和“->”之间的空格替换为  .

例如

object1&nbsp;-> object2&nbsp;-> object3&nbsp;-> object4&nbsp;-> object5&nbsp;-> object6&nbsp;->

  是一个不间断的空白字符，也就是说它不会被破坏。

这是一个例子。

于 2013-08-20T18:33:49.963 回答