HTML中数字和字母不换行显示

HTML中数字和字母不换行显示的默认行为及如何通过CSS的word-wrapword-break属性进行调整。

在HTML中标签中的数字和字母默认是不换行的,如果要将他们换行,在CSS中添加"word-wrap: break-word;" 即可解决

语法:word-wrap: normal|break-word;

normal : 单词默认是不能断开的,长单词就会溢出
break-word : 会首先起一个新行来放置长单词,新的行还是放不下这个长单词则会对长单词进行强制断句。

如果需要,词内换行使用(word-break)即可

语法:word-break:break-all;不会把长单词放在一个新行里,当这一行放不下的时候就直接强制断句了。

css 复制代码
  word-break:break-all;
  word-wrap:break-word

CSS 属性 word-break 指定了怎样在单词内断行。
这个属性原本属于微软扩展的一个非标准、无前缀的属性,叫做 word-wrap,后来在大多数浏览器中以相同的名称实现。目前它已被更名为 overflow-wrap,word-wrap 相当于其别称。

相关推荐
dualven_in_csdn1 小时前
搞了两天的win7批处理脚本问题
java·linux·前端
你的人类朋友2 小时前
✍️【Node.js程序员】的数据库【索引优化】指南
前端·javascript·后端
小超爱编程2 小时前
纯前端做图片压缩
开发语言·前端·javascript
应巅3 小时前
echarts 数据大屏(无UI设计 极简洁版)
前端·ui·echarts
Jimmy3 小时前
CSS 实现描边文字效果
前端·css·html
islandzzzz4 小时前
HMTL+CSS+JS-新手小白循序渐进案例入门
前端·javascript·css·html
Senar4 小时前
网页中如何判断用户是否处于闲置状态
前端·javascript
很甜的西瓜4 小时前
typescript软渲染实现类似canvas的2d矢量图形引擎
前端·javascript·typescript·图形渲染·canvas
Allen Bright4 小时前
【CSS-9】深入理解CSS字体图标:原理、优势与最佳实践
前端·css
软件开发技术深度爱好者4 小时前
HTML版英语学习系统
学习·html