Question

我知道在html中有一个不间断的连字符（＃8209），但是我需要一个不间断的破折号（＃8211）。它们的用法不同。除了在我的整个文档中包装文本并用不间断代码进行破折号（ TEXT＃8211 TEXT ）以外，还有其他适当的方法吗？

Answer 1

这个问题使我在最近的一个项目中发疯。我发现很难相信破折号在默认情况下会破坏字符。如果可以插入html多余的字符，那么⁠效果很好。请注意，在破折号后的中只需要一个单词连接器，因为我相信它们不会在此之前断开。

由于多种原因，在我的源HTML中手动将多余的字符随处放置对我来说是行不通的，因此我想到了一个javascript解决方案，该解决方案会自动将.nobreak CSS类应用于任何破折号和紧随其后的字符。

<style>
    .nobreak {
        white-space: nowrap;
    }
</style>

<body>

    <p>This is a paragraph with a number range, 1–34, and it will never break after the en dash.</p>

    <script>
        $("body").html(function(_, html) {
            return  html.replace(/(–.)/g, '<span class="nobreak">$1</span>')
        });
    </script>

</body>

一个更简单的解决方案可能是使用相同的脚本在短划线后自动插入⁠。只需将js更改为：

$("body").html(function(_, html) {
    return  html.replace(/–/g, '–&#8288;')
});

Answer 2

请尝试用单词联接符（＃8288）将破折号括起来。

TEXT&#8288;&#8211;&#8288;TEXT

Answer 3

根据此documentation以及有关单词Joiner –的其他答案，以下HTML应该会产生不易破折的破折号：

如果字符没有HTML实体，则可以使用小数（十进制）或十六进制（十六进制）引用。

<p>
Will break : 
<br />
 TEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXT&#8211;TEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXT
<p>

<p>
Won't break (word joiner):     
<br />
TEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXT&#8288;&#8211;&#8288;TEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXTTEXT
<p>

不间断破折号，而不是连字符

3 个答案: