[分享]css中如何将文本换行

在CSS中，换行是指在文本中插入一个换行符，使文本在一行结束后自动换到下一行。在HTML中，我们可以使用p标签来定义段落，使用pre标签来定义代码块。 对于段落，我们可以使用whitespace属性来...

在CSS中，换行是指在文本中插入一个换行符，使文本在一行结束后自动换到下一行。在HTML中，我们可以使用p标签来定义段落，使用pre标签来定义代码块。
对于段落，我们可以使用white-space属性来控制文本的换行。其中，white-space属性有三个取值：
- normal：默认值，表示只会在空格和换行符处换行。 - pre：表示会保留文本中的空格和换行符，不进行自动换行。 - pre-wrap：表示会自动换行，但同时保留文本中的空格和换行符。
比如，我们想要在一个段落中显示一篇长文本，但又不希望出现横向滚动条，那么可以这样写：

长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章，长长的文章。

对于代码块，我们通常会使用pre标签来定义。使用pre标签可以保留文本中的空格和换行符，使代码格式更加清晰。同时，我们也可以使用white-space属性来控制文本的换行。通常情况下，我们会使用white-space: pre来保留文本的空白字符和换行符。

  function add(a, b) {
            return a + b;
        } 

在以上这段代码块中，我们使用pre标签定义了代码块，并在标签内使用code标签来定义其中的代码。同时，我们也使用了white-space: pre来保留文本中的空格和换行符。这样，在页面上就可以清晰地显示出代码的格式了。
总的来说，在CSS中控制文本的换行，我们可以根据不同的需求选择不同的white-space属性值，达到改变文本显示方式的效果。而对于段落和代码块的定义，我们可以使用p和pre标签，来清晰地分隔不同类型的文本块。