在法语中的一些标点字符之前的空格:是否有一种CSS方法来避免断行？

Question

例如,在这句话中,"评论声称？",句子中的问号和最后一个单词用空格分隔.

当法语文本写在一列中时,你经常会得到这样的东西:

Elle zigzague倒入empiétersurdes impostures
？杰奎琳门卫的机会.

换行发生在句子的最后一个单词和问号之间,这是不可取的.

Elle zigzague倒入empiétersurdes impostures
？杰奎琳门卫的机会.

有没有办法在纯CSS中解决这个问题？或者我们是否必须手动处理文本并将标点符号和单词包装在不间断的范围内？

Answer 1

 在 HTML 或white-space: nowrap;CSS 中使用。

\n\n

\r\n

\r\n

.sentence {\r\n  width: 314px;\r\n  border: 1px solid #eee;\r\n}\r\n\r\n.nowrap {\r\n  white-space: nowrap;\r\n}\r\n\r\n.sentence > span {\r\n  border-bottom: 1px solid darkred;\r\n}\r\n\r\ncode {\r\n  background-color: #ddd;\r\n  padding: 0.2em;\r\n}

\r\n

<main>\r\n\r\n<h3>Regular space</h3>\r\n<p class="sentence">Elle zigzague pour empi\xc3\xa9ter sur des <span>impostures ?</span> Jacqueline porte chance.</p>\r\n\r\n<h3>Avoid new line with non-breaking space HTML entity <code>&amp;nbsp;</code></h3>\r\n<p class="sentence">Elle zigzague pour empi\xc3\xa9ter sur des <span>impostures&nbsp;?</span> Jacqueline porte chance.</p>\r\n\r\n<h3>Avoid new line with CSS <code>white-space: nowrap</code></h3>\r\n<p class="sentence">Elle zigzague pour empi\xc3\xa9ter sur des <span class="nowrap">impostures ?</span> Jacqueline porte chance.</p>\r\n\r\n</main>

\r\n

\r\n

\r\n

\n