其实一直不明白,也没有认真去想过 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. MySQL索引优化步骤总结

    在项目使用mysql过程中,随着系统的运行,发现一些慢查询,在这里总结一下mysql索引优化步骤 1.开发过程优化 开发过程中对业务表中查询sql分析sql执行计划(尤其是业务流水表),主要是查看sq ...

  2. BP算法的矩阵推导

    目录 1. 需要的微积分知识 1.1 导数 1.2 求导的链式法则 2. 梯度下降法 2.1 梯度 2.2 梯度算法的解释 3.误差反向传播算法 3.1 理论推导 3.1.1 符号说明 3.1.2 推 ...

  3. eclipse创建scrapy项目

    1. 您必须创建一个新的Scrapy项目. 进入您打算存储代码的目录中(比如否F:/demo),运行下列命令: scrapy startproject tutorial 2.在eclipse中创建一个 ...

  4. Electorn(桌面应用)自动化测试之Java+selenium实战例子

    基于electorn的桌面应用,网上相关资料较少.所有记录一下.使用java+selenium+testng对该类型应用的自动化测试方法. 代码样例 package com.contract.web. ...

  5. mysql导出导入数据

    使用sql语句导出数据: 导出时如果不写绝对路径,会提示The MySQL server is running with the --secure-file-priv option so it can ...

  6. 主要的Ajax框架都有什么?

    *  Dojo(dojotoolkit.org):* Prototype和Scriptaculous (www.prototypejs.org和script.aculo.us):* Direct We ...

  7. Struts2内建拦截器

    params拦截器 负责将请求参数设置为Action属性 staticParams拦截器 将配置文件中action元素的子元素param参数设置为Action属性 servletConfig拦截器 将 ...

  8. vim编辑器中没有高亮显示,退格键不能使用的问题

    在~/.vimrc下添加如下内容,立即生效

  9. 迭代加深搜索 C++解题报告 :[SCOI2005]骑士精神

    题目 此题根据题目可知是迭代加深搜索. 首先应该枚举空格的位置,让空格像一个马一样移动. 但迭代加深搜索之后时间复杂度还是非常的高,根本过不了题. 感觉也想不出什么减枝,于是便要用到了乐观估计函数(O ...

  10. vi中删除所有查找到的行

    vi中删除所有查找到的行 在linux中查找文件,结果中有很多是.svn目录里的,把查找结果放到一个文件里. 用vi打开该文件,按ESC,进入命令行模式,输入 :g/\.svn/d 就可以把所有含”. ...