如果你遇到长串英文单词或者url换行的问题，这时候就需要用到word-wrap与word-break这2个css属性啦。

word-wrap:break-word;长单词与url地址自动换行。

word-break:break-all;文本强制换行。

word-wrap:break-word;

比较温和，如果英文单词过长时，它会先尝试把整个单词挪到下一行，如果下一行还是过长(单词长度已经超过了容器)，这时它才会进行单词内的断句。

看截图所示：

word-break:break-all;则是简单粗暴的直接强制单词内的断句

word-wrap与word-break为长单词换行的更多相关文章

  1. word break和word wrap

    默认情况下,如果同一行中某个单词太长了,它就会被默认移动到下一行去: word break(normal | break-all | keep-all):表示断词的方式 word wrap(norma ...

  2. [LeetCode] Longest Word in Dictionary 字典中的最长单词

    Given a list of strings words representing an English Dictionary, find the longest word in words tha ...

  3. word wrap 解惑

    源起 我们经常需要“修复”一个老生常谈的“bug”,那就是文本的自动换行问题.在专业术语上,这种期望得到的渲染现象被称作“word wrap”,即文本处理器有能力把超出页边的整个词自动传到下一行. 在 ...

  4. 【LeetCode】211. Add and Search Word - Data structure design 添加与搜索单词 - 数据结构设计

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 公众号:负雪明烛 本文关键词:Leetcode, 力扣,211,搜索单词,前缀树,字典树 ...

  5. [LeetCode] Add and Search Word - Data structure design 添加和查找单词-数据结构设计

    Design a data structure that supports the following two operations: void addWord(word) bool search(w ...

  6. 211 Add and Search Word - Data structure design 添加与搜索单词 - 数据结构设计

    设计一个支持以下两个操作的数据结构:void addWord(word)bool search(word)search(word) 可以搜索文字或正则表达式字符串,字符串只包含字母 . 或 a-z . ...

  7. Leetcode211. Add and Search Word - Data structure design 添加与搜索单词 - 数据结构设计

    设计一个支持以下两种操作的数据结构: void addWord(word) bool search(word) search(word) 可以搜索文字或正则表达式字符串,字符串只包含字母 . 或 a- ...

  8. [LeetCode] 211. Add and Search Word - Data structure design 添加和查找单词-数据结构设计

    Design a data structure that supports the following two operations: void addWord(word) bool search(w ...

  9. 英文长单词断行 word-break VS word-wrap

    你真的了解word-wrap和word-break的区别吗? 这两个东西是什么,我相信至今还有很多人搞不清,只会死记硬背的写一个word-wrap:break-word;word-break:brea ...

随机推荐

  1. python day-3 基本数据类型

    1. 编码 1. 最早的计算机编码是ASCII. 美国人创建的. 包含了英文字母(大写字母, 小写字母). 数字, 标点等特殊字符!@#$% 128个码位 2**7 在此基础上加了一位 2**8 8位 ...

  2. ZOJ 3874 Permutation Graph 分治NTT

    Permutation Graph Time Limit: 2 Seconds      Memory Limit: 65536 KB Edward has a permutation {a1, a2 ...

  3. 记一次OGG数据写入HBase的丢失数据原因分析

    一.现象二.原因排查2.1 SparkStreaming程序排查2.2 Kafka数据验证2.3 查看OGG源码2.3.1 生成Kafka消息类2.3.2 Kafka配置类2.3.3 Kafka 消息 ...

  4. jsp 中 jstl c:if等标签失效问题

    <c:if test="${page == 1}"> ${s.index+1} </c:if> <c:if test="${page > ...

  5. CentOS7.2安装Vim8和YouCompleteMe

    1.环境 本文使用VMWare虚拟机进行实验,客户机系统是CentOS 7.2最小安装(CentOS-7-x86_64-Minimal-1511.iso) 最终实现效果:安装vim8 + python ...

  6. shell脚本怎么调试

    shell是Linux系统上常用的一种脚本语言.一般从事web后台开发的从业者,都会用到shell,因此shell调试也是一项必备的技能.本文教你如何进行shell脚本调试. 工具/原料   Linu ...

  7. Map实现缓存

    为什么要使用缓存 缓存最终的目的是为减轻服务端压力,减少网络传输请求 客户端缓存 浏览器访问自带缓存~~ 页面缓存 浏览器缓存 App客户端缓存    IOS 前端开发     底层都有缓存技术的 ( ...

  8. nginx网站日志配置

    用yum安装的nginx的日志默认安装在路径:/var/log/nginx nginx配置文件:/etc/nginx/nginx.conf (总配置文件)/etc/nginx/conf.d/defau ...

  9. 为datanode配置多个数据存储地

    datanode配置多个数据存储地址,涉及到以下两个配置项 dfs.name.dir Determines where on the local filesystem the DFS name nod ...

  10. [Selenium] 操作 警告框、提示框、确认框

    以如下页面为例: http://sislands.com/coin70/week1/dialogbox.htm 示例代码: pachage com.learningselenium.normalweb ...