1. span{word-break:normal; width:auto; display:block; white-space:pre-wrap;word-wrap : break-word ;overflow: hidden ;}

white-space -- 通过HTML文档的源代码的排版方式控制页面显示文本的排版方式 
取值: normal | pre | nowrap | pre-wrap | pre-line | inherit 
normal: 正常无变化(默认处理方式.文本自动处理换行.假如抵达容器边界内容会转到下一行) 
pre: 保持HTML源代码的空格与换行,等同与pre标签 
nowrap: 强制文本在一行,除非遇到br换行标签 
pre-wrap: 同pre属性,但是遇到超出容器范围的时候会自动换行 
pre-line: 同pre属性,但是遇到连续空格会被看作一个空格 
inherit: 继承 
初始值: normal 
继承性: 是 
适用于: 所有元素 
white:白色.space:间隔,距离

 

span 文本内容超过宽度自动换行的更多相关文章

  1. [TimLinux] JavaScript table的td内容超过宽度缩为三个点

    1. 思路 CSS控制td内容自动缩为三个点 JS控制鼠标悬浮显示td全部内容 2. 实现 HTML代码: <!DOCTYPE html> <html> <head> ...

  2. css 内容超出宽度自动换行

    1. word-break:break-all;只对英文起作用,以字母作为换行依据2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 PS:要设定宽度!

  3. CSS实现内容超过长度后以省略号显示

    样式: {width: 160px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;} 说明: white-space: ...

  4. css为超过一定宽度的文本内容自动加上省略号

    当在html中某个地方添加文本内容的时候如果内容过长我们会希望他超过一定宽度之后,其余的可以被截断,后面补充为省略号: 实现方式: 1.设置css样式为文本不换行: 2.位包裹文本的标签指定宽度: 3 ...

  5. Easyui datagrid 设置内容超过单元格宽度时自动换行显示

    datagrid 设置内容超过单元格宽度时自动换行显示 by:授客 QQ:1033553122 测试环境 jquery-easyui-1.5.3 问题描述 单元格内容超过单元格宽度不会自动化换行.如下 ...

  6. div中的内容超过容器宽度的问题

    问题描述: <div class="category">    <div class="column-a">排名</div> ...

  7. input文本框自适应文本内容宽度

    input文本框自适应文本内容宽度 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  8. div 加滚动条 超过div宽度 自动换行 div居中

    一.div 中加滚动条 一. <div style=" overflow:scroll; width:400px; height:400px;”></div> 记住宽 ...

  9. CSS控制长文本内容显示(截取的地方用省略号代替)

    自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,下面介绍的是CSS如何实现处理的方法. 现实中经常出现一些内容比较长的文本,为了使整体布局美观,需要将文本内容控制在一行 ...

随机推荐

  1. 细说Redis（二）之 Redis的持久化

    前言 在上一篇文章[细说Redis(一)之 Redis的数据结构与应用场景]中,主要介绍了Reids的数据结构. 对于redis的执行命令,这里不做介绍,因为网上搜索一堆,无必要再做介绍. AOF&a ...

  2. FTP 150 Opening BINARY mode data connection for MLSD 读取目录列表失败

    这完全是因为防火墙的问题,把服务器的防火墙关闭之后,在连接,一切ok

  3. c# 过滤html

    public static string StripHTML(string html) { try { System.Text.RegularExpressions.Regex regex1 = ne ...

  4. 还需要注册的是我们还有一个是“交差集” cross join, 这种Join没有办法用文式图表示，因为其就是把表A和表B的数据进行一个N*M的组合，即笛卡尔积。表达式如下：

             还需要注册的是我们还有一个是"交差集" cross join, 这种Join没有办法用文式图表示,因为其就是把表A和表B的数据进行一个N*M的组合,即笛卡尔积.表 ...

  5. [MongoDB] MongoDB增删查改

    MongoDB的三元素,数据库.集合.文档,集合就是表,文档就是行 开启MongoDB,cd切换到MongoDB的安装目录下的bin目录里,使用命令mongod 开启,参数:--dbpath 路径,把 ...

  6. JavaSE-基础语法(一)--数据类型及包装类

    一.JavaSE-基础语法(一) 一.数据类型 二.变量常量 三.流程控制语句 四.数组 一.数据类型 java语言的数据类型包括两种,基本数据类型和引用数据类型. (1).基本数据类型:变量名指向具 ...

  7. Swagger2限定接口范围

    前面在使用Swagger2时遇到的坑中简单介绍了Swagger的使用. 不过默认情况下,Swagger2会把项目中的所有接口都展示在列表里,特别是你用了Springboot/SpringCloud之后 ...

  8. ES 5 中 判断数组的方法

    源代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  9. node 链接mysql（自动链接）

    Node.js与MySQL交互操作有很多库 felixge/node-mysql 常用 cnpm i mysql --save dev 1.打开mysql 必须要有,我这里面用的是wamp.可视化用的 ...

  10. 06:合法 C 标识符

    06:合法 C 标识符 查看 提交 统计 提问 总时间限制: 1000ms 内存限制: 65536kB 描述 . C语言标识符要求: 1. 非保留字: 2. 只包含字母.数字及下划线(“_”). 3. ...