css中文不换行英文换行

在前端开发中，我们经常需要使用 CSS 来控制排版。一个常见的问题就是如何实现中文不换行，而英文则必须换行的排版效果。
在 CSS 中，我们可以使用 `white-space` 属性来控制空白符的处理方式。其默认值为 `normal`，会将连续的空格、换行、制表符等等都合并成一个空格，并在必要时进行换行。如果将其值设置为 `pre`，则会将文本按照原始的格式呈现，空格和换行符都会被保留。
我们可以结合 `white-space` 属性和伪类选择器 `:lang` 来实现中英文排版的差异化处理。下面是一个示例代码：

<style>
  p:lang(zh-Hans) {
    white-space: nowrap;
  }
  p:lang(en) {
    white-space: pre-wrap;
  }
</style>

<p lang="zh-Hans">这是一段中文文字，它不会换行。</p>

<p lang="en">This is a sentence written in English. It will wrap if necessary.</p> 

在这个示例中，我们使用了 `:lang(zh-Hans)` 和 `:lang(en)` 两个伪类选择器来分别指定中文和英文段落应该采用的样式。对于中文段落，我们将 `white-space` 属性设置为 `nowrap`，使其不换行；而对于英文段落，则使用默认的 `pre-wrap` 值。
当然，这只是一个简单的实现方式，实际上根据需求和具体场景的不同，我们还可以使用其他 CSS 属性，如 `word-wrap`、`hyphens` 等等，来优化排版效果。