首先说一下：浏览器的默认行为，在一行中几个单词 排列着，如果最后一个长单词 太长时 首先是移到下一行，如果该单词的长度大于父元素的宽度，会溢出。

<!doctype html>

<html>

<head>

</head>

<body>

<div style="width:100px;border:1px solid #ccc;">hello world! this is  a  aaaaaaaaaaaaaaaaaaaaaaaaa</div>

</body>

</html>

1、word-wrap:break-word

w3school手册中这样解释的：允许长单词或 URL 地址换行到下一行，也就是说当一个单词的长度超出它所在的区域时 浏览器会将多余的字符移到下一行。

这个属性是只指先允许浏览器对长单词进行换行，因为当一个单词长度太长了，浏览器默认先把它移到下一行，然后如果设置了这个属性，长单词会截断

<div style="width:100px;border:1px solid #ccc;word-wrap: break-word;">hello world! this is  a  aaaaaaaaaaaaaaaaaaaaaaaaa</div>

2、word-break:break-all  属性规定自动换行的处理方法，在哪个位置进行截断

是指对于截断的处理方式是任何地方超出区域后都截断，当一行中最后的单词太长了，如果不加这个属性，那么浏览器会默认先把它下移，

设置这个word-break:break-all 属性后，在当前这一行中进行截断处理。

<div style="width:100px;border:1px solid #ccc;word-wrap: break-word;word-break: break-all;">hello world! this is  a  aaaaaaaaaaaaaaaaaaaaaaaaa</div>

css3中允许单词内断句word-wrap和怎么处理断句word-break的更多相关文章

  1. 43.Word Break（看字符串是否由词典中的单词组成）

    Level:   Medium 题目描述: Given a non-empty string s and a dictionary wordDict containing a list of non- ...

  2. CSS3中的动画效果记录

    今天要记录的是CSS3中的三种属性transform.transition以及animation,这三个属性大大提升了css处理动画的能力. 一.Transform 变形 CSS中transform ...

  3. [LeetCode] Reverse Words in a String 翻转字符串中的单词

    Given an input string, reverse the string word by word. For example, Given s = "the sky is blue ...

  4. CSS3中的弹性流体盒模型技术详解

    先回顾一下CSS1 和 CSS2中都已经定义了哪些布局方面的属性,这样也会增加我们理解弹性布局.   其实我们现在有很多一部分人,你们刚刚接触CSS层叠样式表,或者接触有一段时间了,但是却没有很好的去 ...

  5. C++实现对文件中各单词词频的统计及其代码优化

    先给出github上的代码链接以及项目需求 1.项目概述 这个项目的需求可以概括为:对记事本(txt)文件进行单词的词频统计和排序,排序结果以指定格式输出到默认文件中,并要求能够快速地完成整个统计和结 ...

  6. CSS3中很容易混淆的transform,translate,transition。如何去区分，以及综合写法。

    属性 含义     transition(过渡) 用于设置元素的样式过度,和animation有着类似的效果,但细节上有很大的不同 transform(变形) 用于元素进行旋转.缩放.移动或倾斜,和设 ...

  7. CSS3中的新特性

    一.CSS3新属性 CSS3还不属于W3C标准,所以不同浏览器的支持程度也不相同,对于不同浏览器,写法也不同,不同内核的浏览器要加不同的前缀,如下: transform:rotate(9deg); - ...

  8. css3中的变形（transform）、过渡(transtion)、动画(animation)

    Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放scale和移动translate以及矩阵变形matrix.下面我们一 ...

  9. C#中??和？分别是什么意思？ 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中，对象相等和对象一致分别指的是什么？

    C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...

随机推荐

  1. Lea指令计算地址（用于四则混合运算），附上一个函数调用例子及其反汇编代码，很清楚

    比如你用local在栈上定义了一个局部变量LocalVar,你知道实际的指令是什么么?一般都差不多像下面的样子:     push   ebp     mov   esp,   ebp     sub ...

  2. Migrating from IntelliJ Projects

    We might provide an automatic migration option in Android Studio in the future.   For now, to migrat ...

  3. Python正则匹配多行，多个数据

    最近用Python做一个crawler工具的时候,发现用一个正则表达式可以匹配到个数据的时候用match.group()只能打印出第一个数据,其它数据不能打印出来.最后找到解决方法,现在记录一下,直接 ...

  4. 性能量化之cpu

    系统现在很慢”似乎是对系统的性能最常用的抱怨了,但究竟慢到什么程度,如何来界定慢,可能需要对性能进行量化,对于OS来说,大致主要分为cpu,内存,磁盘,网络等组件,对这些维度的性能量化,不但可以更准确 ...

  5. POJ_3176_Cow_Bowling_(数字三角形)_(动态规划)

    描述 http://poj.org/problem?id=3176 给出一个三角形,每个点可以走到它下面两个点,将所有经过的点的值加起来,问最大的和是多少. Cow Bowling Time Limi ...

  6. 大白书 209 remember the word

    F - Remember the Word Time Limit:3000MS     Memory Limit:0KB     64bit IO Format:%lld & %llu Sub ...

  7. [并发编程]使用线程安全队列和条件变量的notify来安排分步骤任务

    // 方法1:直接构建N个THread来run foreach (i, size) { thread trd(&Instance::doWork, &inst); lstTrd.pus ...

  8. 在Raspberry配置优化安装LNMP环境总结

    在Raspberry配置优化安装LNMP环境总结 apt-get update apt-get install nginx apt-get install php5-fpm php5-cli php5 ...

  9. 在Dubbo中开发REST风格的远程调用（RESTful Remoting）

    rest 在Dubbo中开发REST风格的远程调用(RESTful Remoting)

  10. AVL树的左旋右旋理解 （转）

    AVL树是最先发明的自平衡二叉查找树.在AVL树中任何节点的两个子树的高度最大差别为一,所以它也被称为高度平衡树.查找.插入和删除在平均和最坏情况下都是O(log n).增加和删除可能需要通过一次或多 ...