word-break、word-wrap和其他文字属性
word-break: break-all;
控制是否断词。(粗暴方式断词)
break-all,是断开单词。在单词到边界时,下个字母自动到下一行。主要解决了长串英文的问题。
word-wrap: break-word;
控制是否换行。使用break-word时,是将强制换行。中文没有任何问题,英文语句也没问题。
内容将在边界内换行,仅用于块对象,内联对象要用的话,必须要设定height、width 或 display:block 或 position:absolute。
两个声明语句十分容易混淆,如何记忆?
首字母走起:w-b:b-a 微博吧 , w-w:b-w 我王百万 。
效果比较:

图片来源:http://www.zhangxinxu.com/wordpress/2015/11/diff-word-break-break-all-word-wrap-break-word/
注: word-wrap:break-word 与 word-break:break-all 共同点是都能把长单词强行断句,不同点是word-wrap:break-word 会首先起一个新行来放置长单词,
新的行还是放不下这个长单词则会对长单词进行强制断句;而 word-break:break-all 则不会把长单词放在一个新行里,当这一行放不下的时候就直接强制断句了。
其他文字处理样式:
white-space:nowrap; 用于处理元素内的空白,只在一行内显示。
overflow:hidden; 超出边界的部分隐藏。
text-overflow:ellipsis; 超出部分显示省略号。
参考:
http://www.zhangxinxu.com/wordpress/2015/11/diff-word-break-break-all-word-wrap-break-word/
http://jingyan.baidu.com/album/e75aca855b1500142edac6d0.html?picindex=2
word-break、word-wrap和其他文字属性的更多相关文章
- 17. Word Break && Word Break II
Word Break Given a string s and a dictionary of words dict, determine if s can be segmented into a s ...
- LeetCode之“动态规划”:Word Break && Word Break II
1. Word Break 题目链接 题目要求: Given a string s and a dictionary of words dict, determine if s can be seg ...
- LeetCode ||& Word Break && Word Break II(转)——动态规划
一. Given a string s and a dictionary of words dict, determine if s can be segmented into a space-sep ...
- leetcode@ [139/140] Word Break & Word Break II
https://leetcode.com/problems/word-break/ Given a string s and a dictionary of words dict, determine ...
- word break和word wrap
默认情况下,如果同一行中某个单词太长了,它就会被默认移动到下一行去: word break(normal | break-all | keep-all):表示断词的方式 word wrap(norma ...
- C# 给Word每一页设置不同文字水印
Word中设置水印时,可预设的文字或自定义文字设置为水印效果,但通常添加水印效果时,会对所有页面都设置成统一效果,如果需要对每一页或者某个页面设置不同的水印效果,则可以参考本文中的方法.下面,将以C# ...
- [LeetCode] Word Break II 拆分词句之二
Given a string s and a dictionary of words dict, add spaces in s to construct a sentence where each ...
- 【leetcode】Word Break II
Word Break II Given a string s and a dictionary of words dict, add spaces in s to construct a senten ...
- LeetCode:Word Break II(DP)
题目地址:请戳我 这一题在leetcode前面一道题word break 的基础上用数组保存前驱路径,然后在前驱路径上用DFS可以构造所有解.但是要注意的是动态规划中要去掉前一道题的一些约束条件(具体 ...
- LeetCode Word Break II
原题链接在这里:https://leetcode.com/problems/word-break-ii/ 题目: Given a string s and a dictionary of words ...
随机推荐
- Codeforces 543D Road Improvement(树形DP + 乘法逆元)
题目大概说给一棵树,树的边一开始都是损坏的,要修复一些边,修复完后要满足各个点到根的路径上最多只有一条坏的边,现在以各个点为根分别求出修复边的方案数,其结果模1000000007. 不难联想到这题和H ...
- ural 1075. Thread in a Space
1075. Thread in a Space Time limit: 1.0 secondMemory limit: 64 MB There are three points in a 3-dime ...
- 【BZOJ1003】1003: [ZJOI2006]物流运输trans SPFA+DP
Description 物流公司要把一批货物从码头A运到码头B.由于货物量比较大,需要n天才能运完.货物运输过程中一般要转停好几个码头.物流公司通常会设计一条固定的运输路线,以便对整个运输过程实施严格 ...
- Android -- 简单广播接收与发送(2)--动态注册广播接收器
1. 效果图
- 500-internal server error 错误提示到配置文件的某行,并显示乱码
UTF-8(8-bit Unicode Transformation Format)是一种针对Unicode的可变长度字符编码,又称万国码.UTF-8用1到4个字节编码UNICODE字符.用在网页上可 ...
- 前端自动化工具 -- grunt 使用简介
grunt作为一个前端构建工具,有资源压缩,代码检查,文件合并等功能. 下面就简单了解grunt的使用. 一.环境配置 grunt是基于nodejs的,所以需要一个 nodejs 环境,未了解的可以 ...
- linux shell 获取进程pid
1.通过可执行程序的程序名称 a.运行程序 b.获取进程id号 c.pidof相关知识:http://www.cnblogs.com/yunsicai/p/3675938.html 2.有些程序需要在 ...
- Hibernate映射一对多双向关联关系及部门关联属性
一对多双向关联关系:(Dept/Emp的案例) 既可以根据在查找部门时根据部门去找该部门下的所有员工,又能在检索员工时获取某个员工所属的部门. 步骤如下: 1.构建实体类(部门实体类加set员工集合) ...
- [LintCode] Backpack VI 背包之六
Given an integer array nums with all positive numbers and no duplicates, find the number of possible ...
- Java读取Execl表格数据
在前面提到用java代码新建一个Execl 表格并添加数据到表格中, 这次写了一个读取Execl表格数据并添加导数据库中的案列 给定对方一个Execl模板表格,如果导入的Execl表格和预订的表格不相 ...