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

<!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. 利用CMake生成动态或静态链接库工程

    install解释: TARGETS版本的install命令 install(TARGETS targets... [EXPORT <export-name>] [[ARCHIVE|LIB ...

  2. C# 防止同一个账号多次登录(cache方法)

    c#中防止同一账号重复登录的方法有不少,比如用数据库来记录用户登录情况.用Application来保存用户登录信息.用Cache来保存信息等. 本文为大家介绍如何利用缓存Cache方便地实现此功能. ...

  3. 【Android 开源】：最火的Android开源项目 第02期

    21. drag-sort-listview DragSortListView(DSLV)是Android ListView的一个扩展,支持拖拽排序和左右滑动删除功能.重写了TouchIntercep ...

  4. [C# 网络编程系列]专题三：自定义Web服务器

    转自:http://www.cnblogs.com/zhili/archive/2012/08/23/2652460.html 前言: 经过前面的专题中对网络层协议和HTTP协议的简单介绍相信大家对网 ...

  5. 很反感Java Web 三层框架

    为什么反感,大家 看图就知道了.一层一层的框架叠加,要达到精通就要一个一个框架的去深入了解,谁有这个精力?PHP没有这么多框架,为何依然能开发大型网站呢? 不过此图的原文却在推销使用Java,原文点此 ...

  6. Java新手入门必须掌握的30个基本概念

    今天给大家推荐的文章是有关Java基本概念的,掌握好这些基本概念对学习J2SE.J2EE.J2ME都很重要,也能更好地理解Java的精髓,初学者要注意啦! ▶Java概述: 目前Java主要应用于中间 ...

  7. KTV点歌系统播放原理

    北大青鸟KTV点歌系统播放原理 指导老师--原玉明 1.首先知道有两个类(PlayList   Song) PlayList类中有一方法 public static bool AddSong(Song ...

  8. Android 快捷方式

    1. 需要权限: <uses-permission android:name="com.android.launcher.permission.INSTALL_SHORTCUT&quo ...

  9. [LeetCode] 16. 3Sum Closest 解题思路

    Given an array S of n integers, find three integers in S such that the sum is closest to a given num ...

  10. DES加密，Tk写的简单的GUI

    # -*- coding: UTF-8 -*- from Tkinter import * from tkMessageBox import * ip = [ 58,50,42,34,26,18,10 ...