word-break和word-wrap

1,word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的前端部分),下一行为tulation(conguatulation)的后端部分了。

2,word-wrap:break-word 例子与上面一样,但区别就是它会把congratulation整个单词看成一个整体,如果该行末端宽度不够显示整个单词,它会自动把整个单词放到下一行,如果还是放不下,就会截断。

相关推荐
‘’林花谢了春红‘’9 天前
小玩意 生日快乐
css·html·css3
志尊宝17 天前
Vue3 环境搭建 + 第一个 HelloVue 项目(零基础入门)
vue.js·node.js·vue·css3
More more17 天前
纯手搓css样式:科技感弹窗边框
css·科技·css3
丨我是张先生丨19 天前
英语单词 Web Page
前端·css·css3
丨我是张先生丨20 天前
日语单词 Web Page
前端·css·css3
AI视觉网奇1 个月前
three教学 3d资产拼接源代码
前端·css·css3
神明不懂浪漫1 个月前
【第三章】CSS(一)——基础选择器、CSS的属性
前端·css·html·css3
智码看视界1 个月前
老梁聊全栈:CSS3 高级特性—Flex/Grid 布局体系深度解析
前端·css3·布局·flexbox·grid·工程实践·全栈工程师
gz-郭小敏1 个月前
优化横向滚动展示大量数据的时候数据晃动问题
前端·javascript·html·css3
贩卖黄昏的熊1 个月前
flex 布局快速梳理
开发语言·javascript·css3·html5