美文网首页
文字、字母以及数字的换行不换行问题总结

文字、字母以及数字的换行不换行问题总结

作者: 懒懒猫 | 来源:发表于2022-01-23 16:57 被阅读0次

(1)要求强制不换行:

p{white-space:nowrap}

(2)换行

(2.1)要求文字等不换行且超出范围省略号显示

p{width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}

(2.2)自动换行:p{white-space:normal(默认值)}
(2.3)特殊的,针对字母以及数字的换行问题:

p{word-break:break-all} (表示按照单个字母去换行,不保证单词的完整性);

p{word-break:break-word}(表示按照单词去换行,确保单词完整);

注:此时需要把元素设置为块级元素才能看得到效果

相关文章

网友评论

      本文标题:文字、字母以及数字的换行不换行问题总结

      本文链接:https://www.haomeiwen.com/subject/niibhrtx.html