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. 获取DNS服务器的版本信息

    1 如何获取DNS服务器的版本信息 向某个DNS服务器发送下面的请求即可获得版本信息 dig @115.124.17.156 version.bind chaos txt 它返回的信息如下: ; &l ...

  2. jobss目录结构

    一. JBoss的目录结构       bin:包含各种脚本文件以及相关文件,比如run.bat和shutdown.bat批处理文件.        client:存储配置信息和可能被Java客户端应 ...

  3. Apache RocketMQ在linux上的常用命令

    Apache RocketMQ在linux上的常用命令 进入maven安装后的rocketmq的bin目录  1.启动Name Server  2.启动Broker 3.关闭Name Server 4 ...

  4. Ajax之跨域请求

    一.引子 我现在开启了两个django项目,分别叫Demo1和Demo2,Demo1中有一个路径‘http://127.0.0.1:8000/index/’,对应的视图是index视图返回一个inde ...

  5. 使用WPF教你一步一步实现连连看（一）

    第一步: 问题,怎样动态的建立一个10*10的grid(布局) for (int i = 0; i < 10; i++) { RowDefinition rowDef = new RowDefi ...

  6. 拜小白教你OpenCV3.2.0+VS2017开发环境配置

    第一部分:OpenCV3.2.0的下载 OpenCV官方下载地址: http://opencv.org/releases.html# 本人选择opencv3.2.0基于Windows平台.读者根据自己 ...

  7. Flash饼状图统计代码

    index.html文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...

  8. blfs（systemv版本）学习笔记-为桌面环境构建xorg服务

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! lfs准备使用桌面环境,首先需要构建xorg服务 xorg服务项目地址:http://www.linuxfromscratch. ...

  9. 2018-04-21 搭建Python官方文档翻译环境

    参考PEP 545 -- Python Documentation Translations fork的编译脚本: nobodxbodon/docsbuild-scripts, 添加了zh语言标签, ...

  10. React Native中Mobx的使用

    从今天开始我们来搞搞状态管理可否,这几天没怎么写博客,因为被病魔战胜了,tmd,突然的降温让我不知所措,大家最近注意安全,毕竟年底了,查的严,呸,大家注意保暖 特别声明:写该文只是写一下用MobX的思 ...