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 ...
随机推荐
- SOAPUI测试步骤之断言测试(Assertion TestStep)
什么是没有办法验证结果的测试?soapUI提供了两种方法来测试断言:断言TestSteps现在断言一步步测试(PRO版本).The Assertion TestStep,扩展了断言处理和管理的想法.此 ...
- ReLu(Rectified Linear Units)激活函数
论文参考:Deep Sparse Rectifier Neural Networks (很有趣的一篇paper) 起源:传统激活函数.脑神经元激活频率研究.稀疏激活性 传统Sigmoid系激活函数 传 ...
- topcoder SRM 610 DIV2 DivideByZero
题目的意思是给你一组数,然后不断的进行除法(注意是大数除以小数),然后将得到的结果加入这组数种然后继续进行除法, 直到没有新添加的数为止 此题按照提议模拟即可 注意要保持元素的不同 int Count ...
- Codeforces Round #249 (Div. 2) B. Pasha Maximizes
看到题目的时候,以为类似插入排序,比较第i个元素和第i-1个元素, 如果第i个元素比第i-1个元素小,则不交换 如果第i个元素比第i-1个元素大,则交换第i个元素和第i-1个元素 继续比较第i-1个元 ...
- ubuntu13.04下安装jdk7
参考http://www.neversaydie.cc/ubuntu-install-jdk-in-detailed/ 而来 1.手工从Oralce官网下载jdk-7u25-linux-x64.gz ...
- 【BZOJ】1975: [Sdoi2010]魔法猪学院
题意 \(n(2 \le n \le 5000)\)个点,找尽量多的不同\(1\)到\(n\)的路径,每一次的花费就是路径的全值和,要求在费用不超过\(E\)的情况下路径最多. 分析 裸的最段路. 题 ...
- 【BZOJ】1105: [POI2007]石头花园SKA
题意 二维平面上有\(n(2 \le n \le 1000000)\)个点,可以花费\(w_i\)交换第\(i\)个点的横纵坐标.求在满足能覆盖所有点的最小矩阵周长最短的情况下花费最小. 分析 这题太 ...
- 【JAVA】Spring 事物管理
在Spring事务管理中通过TransactionProxyFactoryBean配置事务信息,此类通过3个重要接口完成事务的配置及相关操作,分别是PlatformTransactio ...
- jquery 最简单的动画效果
<p style="border: 1px solid red"> 我会慢慢变大 </p> <a>dianji</a> <sc ...
- C#中的接口
C#中的接口(转) 转自:http://www.cnblogs.com/zhenyulu/articles/377705.html 本文中所有图示纯为个人理解(参考了Assembly中元数据的存储方式 ...