其实一直不明白，也没有认真去想过 word-break 属性的 break-all 和 break-word 有什么区别

　　后来看了一个大神写的一篇博客，写得很详细，看了豁然开朗。

　　所以，我也就不在过多赘述，直接上demo，最后会附上原文链接

　　demo

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

    <title></title>

    <style type="text/css">

        * {

            margin: 0;

            padding: 0;

        }

        .div01,.div02 {

            width: 300px;

        }

        .div01 {

            word-break: break-all;

        }

        .div02 {

            word-break: break-word;

        }

    </style>

</head>

<body>

    <div class="div01">show me the money give me the money</div>

    <div class="div02">show me the money give me the money </div>

</body>

</html>

　　下面截图是上面demo的运行结果

　　

　   第一行的英文使用了：word-break: break-all;

　   第二行的英文使用了：word-break: break-word;

　　共同点：

　　都是可以对英文单词进行断句换行

　　不同点：

　　word-break:break-all  紧接着前面的单词，并强行断句换行（比如上面截图中的 money 是紧跟着前面的 the）

　　word-break:break-word  不会紧接着前面的单词，而是整个单词直接另起一行 （比如上面截图中的 money，没有紧跟前面的 the，直接换行）

　　 注：word-break上面的2个属性不仅适用于英文单词，还适用于数字；　　　

　  补充：word-break和word-wrap属性的区别　

　  原文链接：https://www.cnblogs.com/2050/archive/2012/08/10/2632256.html

终于明白word-break属性——break-all和break-word的区别的更多相关文章

  1. 循环结构中break、continue、return和exit的区别

    1. break break语句的使用场合主要是switch语句和循环结构.在循环结构中使用break语句,如果执行了break语句,那么就退出循环,接着执行循环结构下面的第一条语句.如果在多重嵌套循 ...

  2. break、continue、exit、return的区别和对比

    break.continue.exit.return的区别和对比 一:说明 break.continue在条件循环语句及循环语句(for.while.if等)中用于控制程序的走向:而exit则用于种植 ...

  3. 批量修改WORD表格属性

    有时候需要对word中很多表格的属性进行修改,而word无法批量修改属性,所有这里记录一个宏 Sub TableFormatter() Dim oTbl As Table, i As Integer ...

  4. MySQL、sqlalchemy、pymysql、mysqldb、DBAPI之间关系梳理（终于明白了）

    MySQL.sqlalchemy.pymysql.mysqldb.DBAPI之间关系梳理(终于明白了) python3不再支持mysqldb 请用pymysql和mysql.connector 问题背 ...

  5. javascript下用ActiveXObject控件替换word书签，将内容导出到word后打印第1/2页

    由于时间比较紧,没多的时候去学习研究上述工具包,现在用javascript操作ActiveXObject控件,用替换word模板中的书签方式解决. 最近有需求将数据导出到word里,然后编辑打印. 想 ...

  6. [.NET] 开头不讲"Hello Word"，读尽诗书也枉然 : Word 操作组件介绍 - Spire.Doc

    开头不讲"Hello Word",读尽诗书也枉然 : Word 操作组件介绍 - Spire.Doc [博主]反骨仔 [原文地址]http://www.cnblogs.com/li ...

  7. asp.net对word文档进行修改 对于使用word文档做模板编辑比较适用

    最近做项目,需要多word文档进行编辑并导出一个新的word,在最初的word编辑中留下特定的字符串用来替换,然后在本地生成一个新的word文档,并且不修改服务器中的word文档,这样才能保证服务器中 ...

  8. 终于有人把O2O、C2C、B2B、B2C的区别讲透了！

    终于有人把O2O.C2C.B2B.B2C的区别讲透了! 一.O2O.C2C.B2B.B2C的区别在哪里? O2O是online to offline分为四种运营模式: 1.online to offl ...

  9. ASP.NET实现在线浏览Word文档另一种解决方案(Word转PDF)

    ASP.NET实现在线浏览Word文档另一种解决方案(Word转PDF)      上述博文里提到的在线浏览pdf的方案不错,但word转pdf的那个dll只支持doc不支持docx,附上最新的下载链 ...

随机推荐

  1. 移值UCOS2到M4核与M3核的区别

    之前移值过ucos2到stm32f2系列的单片机,这个单片机是属于arm的m3内核的.最近在学习永磁同步电机的控制,对于这个电机的控制,有比较多的数学计算,甚至于还有浮点的运算.所以用到了stm32f ...

  2. 多个表左联，要返回全部的结果，解决不能用where的问题

    qb.leftJoin('info_student', 'grouping_class_student.studentId', 'info_student.id'); qb.leftJoin('gro ...

  3. 安装CentOS 7 的yum 到 Radhat 7上，使其可以获取资源

    镜像资源: 1. http://mirrors.163.com/ 2. https://opsx.alibaba.com/mirror 从上列镜像资源下载如下rpm软件包 -rw-r--r--. 1 ...

  4. 装了SVN软件，但是文件夹没有绿色和红色的图标显示

    第一步: win+R,输入regedit,打开注册表.查找ShellIconOverlayIdentifiers,可以找到Tortoise相关的标签,这个时候会发现,这些标签都排在后面.需要在这些标签 ...

  5. 2018-2019-2 《网络对抗技术》 EXP0 KALI安装 20165213 Week1

    kali安装过程 一.从官网下载kail 下载地址为:https://www.kali.org/downloads/ 选择下图中的kali下载 二.用VMware打开虚拟机 打开VMware,点击打开 ...

  6. Java第4次实训作业

    编写"电费管理类"及其测试类. 第一步 编写"电费管理"类 私有属性:上月电表读数.本月电表读数 构造方法:无参.2个参数 成员方法:getXXX()方法.se ...

  7. 微信for linux

    http://blog.csdn.net/sunxiang_520/article/details/51637551

  8. BSOJ3760||洛谷P1453 城市环路 题解

    城市环路 Description 一座城市,往往会被人们划分为几个区域,例如住宅区.商业区.工业区等等.B市就被分为了以下的两个区域——城市中心和城市郊区.在着这两个区域的中间是一条围绕B市的环路,环 ...

  9. ajax 参数记录

    1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如 ...

  10. java -version显示版本和JAvA_HOME配置不一样

    当你需要安装多个版本的jdk时,可能会遇到更改了JAVA_HOME后java -version不变的情况. 一般情况下,将你的JAVA_HOME改为你要用的jdk的安装路径,然后你使用的就是这个版本的 ...