CSS——css 文字自动换行方法
在CSS中,可以使用word-wrap
和word-break
属性来控制文字的自动换行。
word-wrap: break-word;
允许在长单词或URL地址内部进行换行。word-break: break-all;
允许在单词内部任意位置换行。
示例代码:
/* 允许在长单词内部换行 */
p.break-word {
word-wrap: break-word;
}
/* 允许在单词内部任意位置换行 */
p.break-all {
word-break: break-all;
}
HTML部分:
<p class="break-word">这是一个非常非常长的单词:superlongwordthatneedstobewrapped</p>
<p class="break-all">这是一个需要在任意位置换行的非常长的单词:superlongwordthatneedstobewrapped</p>
在这个例子中,第一个<p>
元素使用了word-wrap: break-word;
,它会在长单词到达容器边缘时自动换行。第二个<p>
元素使用了word-break: break-all;
,它允许在单词内部任意位置进行换行,这对于某些语言(如东亚语言)可能更为合适,因为它们习惯于在单词内部换行。
评论已关闭