white-space:normal; word-break:break-all;

white-space: normal|pre|nowrap|pre-wrap|pre-line|inherit;
white-space 属性设置如何处理元素内的空白
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 pre 标签。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 br 标签为止。
pre-wrap 保留空白符序列,但是正常地进行换行。
pre-line 合并空白符序列,但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。

word-wrap: normal|break-word;
word-wrap 属性用来标明是否允许浏览器在单词内进行断句,这是为了防止当一个字符串太长而找不到它的自然断句点时产生溢出现象。
normal: 只在允许的断字点换行(浏览器保持默认处理)
break-word:在长单词或URL地址内部进行换行
word-break: normal|break-all|keep-all;

word-break 属性用来标明怎么样进行单词内的断句。
normal:使用浏览器默认的换行规则。
break-all:允许再单词内换行
keep-all:只能在半角空格或连字符处换行

1、单行文本溢出显示省略号(…)

text-overflow:ellipsis-----部分浏览器还需要加宽度width属性

overflow:hidden;text-overflow:ellipsis;white-space:nowrap;

2、多行文本溢出显示省略号,WebKit浏览器或移动端的页面

overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;

css连续的纯数字或字母强制换行的更多相关文章

  1. js校验密码,不能为空的8-20位非纯数字或字母的密码

    jsp: <div class="mui-input-row"> <label>密码</label><!-- id='password' ...

  2. php生成纯数字、字母数字、图片、纯汉字的随机数验证码

    现在讲开始通过PHP生成各种验证码旅途,新手要开车了,请刷卡! 首先,我们开始先生成一个放验证码的背景图片 注:没有Imagejpg()这个函数,只有imagepng()函数 imagecreatet ...

  3. 解决table td里面长串数字或字母不换行的问题

    在html中,经常要用到table标签,一般情况下,table下面的td元素里的东西都是汉字或者说是汉字.字母.数字的混合,在这种情况下,不设置table的宽度,也就是table宽度自适应的时候,浏览 ...

  4. Html 解决数字和字母不换行

    在html页面中,如果是数字或者字母显示的话,默认是不换行的.一般显示成这种: 解决方法确实也很简单,设置td或者div为: style="word-break:break-all;&quo ...

  5. css纯数字或字母换行

    #div { word-wrap:break-word; word-break:break-all; }

  6. CSS代码使纯英文数字自动换行

    当一个定义了宽度的块状元素中填充的全部为纯英文或者纯数字的时候,在IE和FF中都会撑大容器,不会自动换行并且当数字或者英文中带有汉字时,会从汉字处换行,而纯汉字却可以自动换行.这个问题如何解决?先来认 ...

  7. Java随机生成定长纯数字或数字字母混合数

    (转)Java随机生成定长纯数字或数字字母混合数 运行效果图: 具体实现代码

  8. php生成随机字符串可指定纯数字、纯字母或者混合的

    php 生成随机字符串 可以指定是纯数字 还是纯字母 或者混合的. 可以指定长度的. function rand_zifu($what,$number){ $string=''; for($i = 1 ...

  9. CSS div内放长英文字母或长数字自动换行 CSS一行排不下自动打断换行

    添加css  word-wrap:break-word 解释:使用break-word时,是将强制换行. 兼容各版本IE浏览器,兼容谷歌浏览器.

随机推荐

  1. QT中显示图像数据

    博客转载自:https://blog.csdn.net/lg1259156776/article/details/52325091 一般图像数据都是以RGBRGBRGB……字节流的方式(解码完成后的原 ...

  2. 算法Sedgewick第四版-第1章基础-2.1Elementary Sortss-001选择排序法(Selection sort)

    一.介绍 1.算法的时间和空间间复杂度 2.特点 Running time is insensitive to input. The process of finding the smallest i ...

  3. vue 之 指令系统介绍

    浏览目录 条件渲染 class 与style绑定 事件处理 指令系统介绍 所谓指令系统,大家可以联想咱们的cmd命令行工具,只要我输入一条正确的指令,系统就开始干活了. 在vue中,指令系统,设置一些 ...

  4. Website开发前页面设计 Mockup的一些工具

    这里介绍的Website开发前,页面设计的一些工具 1. Balsamiq    (我们公司用的) https://balsamiq.com/download/ 2. Figma https://ww ...

  5. Bootstrap 组件之 Panel

    一.简介 Panel 指面板.这里 有例子. 一个典型的面板的代码结构是这样的: .panel.panel-default .panel-heading .panel-title Title Text ...

  6. JLink间接烧写【转自armobbs】

    1. 简要说明 JLink的调试功能.烧写Flash的功能都很强大,但是对于S3C2410.S3C2440的Flash操作有些麻烦:烧写Nor Flash时需要设置SDRAM,否则速率很慢:烧写Nan ...

  7. python 常用的一些库

    AllPairs 2.0.1Appium-Python-Client 0.24asn1crypto 0.24.0attrs 17.4.0AutoItLibrary 1.1bcrypt 3.1.4bea ...

  8. mysql死锁问题解决

    1. 定位问题 http://blog.csdn.net/beiigang/article/details/43228361 2. 解决死锁 http://www.blogbus.com/ri0day ...

  9. 【转】oracle远程导入数据库

    源地址:http://blog.chinaunix.net/uid-20980141-id-447996.html

  10. FullCalendar插件的基本使用

    我的另一博客地址:https://segmentfault.com/u/lyrfighting/articles 前段时间,一直在开发考勤系统,当时为满足设计的需求,选了好几个插件,最后决定采用Ful ...