css中如何设置换行

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

在CSS中,我们可以使用 white-space 属性来控制换行的方式。该属性有 3 种取值:- normal:默认值,会舍弃多余的空格和换行符,只保留一个空格,需要换行时才进行换行;- nowrap

在CSS中,我们可以使用 white-space 属性来控制换行的方式。该属性有 3 种取值:
- normal:默认值,会舍弃多余的空格和换行符,只保留一个空格,需要换行时才进行换行;
- nowrap:不允许换行,只有在遇到
<br>
标签或强制换行符时才会进行换行;
- pre:保留所有空格和换行符,不会进行任何处理。
要使用这些取值,只需要在 CSS 中针对需要设置的元素使用 white-space 属性即可,例如:
css
p {
  white-space: pre;
} 

在上面的例子中,我们将所有
<p>
标签的 white-space 属性设置为 pre。这样,
<p>
中原本存在的所有空格和换行符都会被保留下来,不会被忽略掉。
如果你想让文本中的空格和换行符仅保留一个,可以将 white-space 属性设置为 normal。在大多数情况下,这也是默认值。
css
p {
  white-space: normal;
} 

另外,如果你想禁止某个元素中的文本换行,可以将 white-space 属性设置为 nowrap。在这种情况下,即使
<p>
标签中存在较长的文本,也不会进行自动换行。
css
p {
  white-space: nowrap;
} 

总之,在 CSS 中设置换行是一个很简单的事情。只需要理解 white-space 属性的 3 种取值,就可以根据需要控制文本的换行方式了。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css中如何设置换行

粉丝

0

关注

0

收藏

0

已有0次打赏