在很多时候,为了防止内容过长把表格或容器撑破, 我们都需要为容器加上自动换行的功能。

实现自动换行,用CSS来实现,通常有两种方式:

  • word-break:

取值为 normal, break-all, keep-all

  • word-wrap:

取值为 normal, break-word

word-break: break-all 太霸道,无条件折行,会造成 英文单词 和 数字的断行,不建议使用。

推荐使用的是:

首先新建html文件,将下面的代码考入:

{word-wrap: break-word; overflow: hidden; text-overflow: ellipsis;}

对 FF3 应该是兼容的。

来自:http://goodboy5264.blog.163.com/blog/static/253829820091110305144/

过长文字自动换行的技巧 Word-Break Word-Wrap的更多相关文章

  1. 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 ...

  2. 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 ...

  3. 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 ...

  4. 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 ...

  5. canvas文字自动换行、圆角矩形画法、生成图片手机长按保存、方形图片变圆形

    canvas的文字自动换行函数封装 // str:要绘制的字符串 // canvas:canvas对象 // initX:绘制字符串起始x坐标 // initY:绘制字符串起始y坐标 // lineH ...

  6. 使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行

    使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行 前几天项目中有一个图表的是用echart生成的,遇到一个问题,就是在手机端显示的售时候,如果文字太长就会超出div,之前的 ...

  7. [Leetcode Week9]Word Break II

    Word Break II 题解 题目来源:https://leetcode.com/problems/word-break-ii/description/ Description Given a n ...

  8. 【Word Break II】cpp

    题目: Given a string s and a dictionary of words dict, add spaces in s to construct a sentence where e ...

  9. word break和word wrap

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

随机推荐

  1. hdu 3635 Dragon Balls

    Dragon Balls Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Tot ...

  2. mysql中文乱码的一点理解

    我们自己鼓捣mysql时,总免不了会遇到这个问题:插入中文字符出现乱码,虽然这是运维先给配好的环境,但是在自己机子上玩的时候咧,总得知道个一二吧,不然以后如何优雅的吹牛B. 如果你也遇到了这个问题,咱 ...

  3. 【SQLServer】使用T-SQL访问远程数据库:openrowset 和 openquery 以及连接服务器的创建

    █ 启用/关闭Ad Hoc Distributed QueriesAd Hoc Distributed Queries服务默认是关闭的,要使用openrowset 和 openquery访问远程数据库 ...

  4. asp.net select Case条件语句的使用方法

    原文:http://www.111cn.net/net/vb-net/38548.htm 如果 testexpression 与任何 Case expressionlist 表达式匹配 ,则执行此 C ...

  5. Cocos2d-x开发中Ref内存管理

    Ref类是Cocos2d-x根类,Cocos2d-x中的很多类都派生自它,例如,我们熟悉的节点类Node也派生自Ref.我们介绍Ref内存管理.内存引用计数Ref类设计来源于Cocos2d-iphon ...

  6. SAP第一轮面试之英语群面

    很高兴通过了SAP的笔试,昨天进行了一轮面试.SAP一轮面试是英语群面(无领导小组讨论) 面试提前大约五天的样子通知面试时间地点,一般是在公司,要求正装.这些都会在HR联系你时通知的,所以不再啰嗦. ...

  7. java 读写锁

    http://tutorials.jenkov.com/java-concurrency/read-write-locks.html 翻译 读写锁比LOCK的实现更复杂,想象有一个应用程序能读和写一些 ...

  8. WinForm条码打印

    在这篇博客中,我曾经介绍了如何实现条形码的生成(生成jpg格式的图片),这篇博客借用上面生成的条码,能够实现条形码的打印功能. 出于批量打印操作的方便以及操作体验考虑,我选择了WinForm.功能很简 ...

  9. python学习之html从0开始(二)

    <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content ...

  10. Openvpn完美解决公司网络没有固定公网IP的问题

    方案背景: 公司办公网络使用长城宽带上网有一段时间了,有4个固定IP(2个电信,2个网通),链路不太稳定,经常有问题,因此考虑取消长城宽带,采用原来的adsl上网.但是有个问题,因为公司内网有几台服务 ...