【问题标题】:CSS/HTML5 Avoid line break on things such as ":-)" [duplicate]CSS / HTML5避免在诸如“:-)”之类的东西上换行[重复]
【发布时间】:2017-04-04 20:45:52
【问题描述】:

我有包含使用 ascii 字符的笑脸的字符串,例如 :-),我需要在网页上显示它们。

当笑脸位于行尾时,它可能会被分成两行。我不希望这种情况发生。我总是希望将笑脸显示为单数“单词”(在这种情况下,整个笑脸将显示在第二行)。

有人可以提出解决方案吗?

编辑 1 & 2

正如我在评论中提到的,这里的想法是标点符号的集合不一定被视为一个单词......这实际上是我面临的问题。所以如果我在行尾有“comment”,这个词就不会被分割,但是如果你有“;.!,;:”,那么这个词就会被分割。

此外,您指出的答案不建议我使用的解决方案word-break: keep=all。因此我相信这是互补和不同的。

【问题讨论】:

  • 我想过,但它似乎会破坏这个词,因为它是由标点符号组成的,我不希望这被视为一个世界,而是被分解/分裂.但我会尝试...
  • 链接的“重复”问题与这个问题无关。这是关于断字。另一个是关于换行的。这应该重新打开。
  • @bearfriend 有什么区别?当单词到达一行的边界时,这不都是为了打破一个单词吗?
  • 没有。一种是防止整个文本块换行成多行,另一种是防止单个单词在行之间拆分。
  • @bearfriend 我明白了。投票重新开放。

标签: css html


【解决方案1】:

您实际上可能想要:word-wrap: break-word

【讨论】:

    【解决方案2】:

    【讨论】:

      【解决方案3】:

      一个简单的white-space: nowrap 应该可以完成这项工作。

      只需将您的笑脸包装在一个带有类的跨度中:.nowrap 并将该属性声明给该类。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2012-03-20
        • 1970-01-01
        • 1970-01-01
        • 2021-05-01
        • 1970-01-01
        • 1970-01-01
        • 2013-08-09
        • 2013-03-01
        相关资源
        最近更新 更多