易混淆知识点(1)：word-wrap和word-break傻傻分不清楚

这两个东西是什么，我相信至今还有很多人搞不清?

我们一起来看看W3C怎么介绍的：

word-wrap 属性：允许长单词或 URL 地址换行到下一行。

值	描述
normal	只在允许的断字点换行（浏览器保持默认处理）。
break-word	在长单词或 URL 地址内部进行换行。

注意：break-word需要容器设定宽度才会起作用。

word-break属性:通过使用 word-break 属性，可以让浏览器实现在任意位置的换行。

值	描述
normal	使用浏览器默认的换行规则。
break-all	允许在单词内换行。
keep-all	只能在半角空格或连字符处换行。

实现效果都是让很长的英文单词直接断词语换行，如图:

断词前：

断词后：

那他们之间到底有什么区别呢？

总结：word-wrap 是用来决定允不允许单词内断句的，如果不允许的话长单词就会溢出。最重要的一点是它还是会首先尝试挪到下一行，看看下一行的宽度够不够，不够的话就进行单词内的断句。并且需要容器设置了指定的宽度才会生效。

而word-break:break-all则更变态，因为它断句的方式非常粗暴，它不会尝试把长单词挪到下一行，而是直接进行单词内的断句。

易混淆知识点(1)：word-wrap和word-break傻傻分不清楚相关推荐

计算机信息处理技术的基础知识列举出一些易错易混淆知识点,计算机考证实训报告指导书.doc...
计算机考证实训报告指导书实训目的: 掌握计算机信息处理与应用的基础知识,掌握以Windows XP和Microsoft Office 2003为工作平台,应用计算机高效率.高质量地进行信息处理的基本 ...
2022下半年系统集成项目管理工程师易混淆知识点：职能型、矩阵型、项目型组织结构
很多考生在备考2022下半年软考系统集成项目管理工程师考试,以下为2022下半年系统集成项目管理工程师易混淆知识点:职能型.矩阵型.项目型组织结构,相信对大家备考会有帮助. 概念辨析:职能型.矩阵型. ...
不能混淆_生物易混淆知识点小汇总，是你不能混淆的知识哦丨高中
点击蓝字关注我们别说你全知道哦咩咩准备的可是易混淆汇总一. 类脂与脂类脂类:包括脂肪.固醇和类脂,因此脂类概念范围大. 类脂:脂类的一种,其概念的范围小. 二. 纤维素.维生素与生物素纤 ...
易混淆知识点（2）：display:none与visible:hidden的区别
display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none 不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不 ...
易混淆知识点（3）：b和strong的真正区别在哪？
如果你使用<b>标签的理由是为了强调,那么你只需要用strong标签把它替换即可,在表现上,b标签和strong标签都是对文字进行加粗,看不出区别,但在标签语义上来说,strong标签是具 ...
PMP考试易混淆知识点
文件内容项目章程:中记录高层级的需求.高层级的风险,高层级项目描述,项目范围定义.成功标准(可测量的项目目标和成功标准) 范围说明书:验收标准.可交付成果.除外责任.制约因素.假设条件范围管理计划 ...
verilog易混淆知识点
一.&与&&的区别 &&是逻辑与:即判断&&两侧的表达式是否都为真,都为真则此&&表达式值为真:逻辑与结果只讲真和假& ...
Java易混淆知识点
1. 数组有没有length()这个方法? String有没有length()这个方法? 2. String s = new String("xyz");创建了几个S ...
算法与数据结构【30天】集训营——线性表之易混淆知识点双链表的结点前插和后插（05）
目录双链表的插入 P结点后插入新的结点S(后插案例) P结点前插入新的结点q(前插案例) 每文一语双链表的插入在双链表的插入操作,我们比较头疼的就是,明明选项看着答案都是比较的完整,但是为啥就是 ...

易混淆知识点(1)：word-wrap和word-break傻傻分不清楚

易混淆知识点(1)：word-wrap和word-break傻傻分不清楚相关推荐

最新文章

热门文章