span 文本内容超过宽度自动换行
- 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 文本内容超过宽度自动换行的更多相关文章
- [TimLinux] JavaScript table的td内容超过宽度缩为三个点
1. 思路 CSS控制td内容自动缩为三个点 JS控制鼠标悬浮显示td全部内容 2. 实现 HTML代码: <!DOCTYPE html> <html> <head> ...
- css 内容超出宽度自动换行
1. word-break:break-all;只对英文起作用,以字母作为换行依据2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 PS:要设定宽度!
- CSS实现内容超过长度后以省略号显示
样式: {width: 160px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;} 说明: white-space: ...
- css为超过一定宽度的文本内容自动加上省略号
当在html中某个地方添加文本内容的时候如果内容过长我们会希望他超过一定宽度之后,其余的可以被截断,后面补充为省略号: 实现方式: 1.设置css样式为文本不换行: 2.位包裹文本的标签指定宽度: 3 ...
- Easyui datagrid 设置内容超过单元格宽度时自动换行显示
datagrid 设置内容超过单元格宽度时自动换行显示 by:授客 QQ:1033553122 测试环境 jquery-easyui-1.5.3 问题描述 单元格内容超过单元格宽度不会自动化换行.如下 ...
- div中的内容超过容器宽度的问题
问题描述: <div class="category"> <div class="column-a">排名</div> ...
- input文本框自适应文本内容宽度
input文本框自适应文本内容宽度 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- div 加滚动条 超过div宽度 自动换行 div居中
一.div 中加滚动条 一. <div style=" overflow:scroll; width:400px; height:400px;”></div> 记住宽 ...
- CSS控制长文本内容显示(截取的地方用省略号代替)
自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,下面介绍的是CSS如何实现处理的方法. 现实中经常出现一些内容比较长的文本,为了使整体布局美观,需要将文本内容控制在一行 ...
随机推荐
- cmd命令窗口连接mysql的命令大全
连接:mysql -h主机地址 -u用户名 -p用户密码 (注:u与root可以不用加空格,其它也一样)断开:exit (回车) 创建授权:grant select on 数据库.* to 用户名@登 ...
- 自己写的thinkphp自动生成类
模型类:CqhModel.class.php <?php namespace Cqh\Model; use Think\Model; class CqhModel extends Model { ...
- netty源码解解析(4.0)-1 核心架构
netty是java开源社区的一个优秀的网络框架.使用netty,我们可以迅速地开发出稳定,高性能,安全的,扩展性良好的服务器应用程序.netty封装简化了在服务器开发领域的一些有挑战性的问题:jdk ...
- C# 反射和Type类
一.元数据和反射 1.1 定义 大多数程序都要处理数据,包括读.写.操作和显示数据.然而,对于某些程序来说,它们操作的不是数字.文本或图形,而是程序和程序类型本身的信息. ● 有关程序及其类型的数据被 ...
- Golang包管理工具之govendor的使用
1. govendor简介 golang工程的依赖包经常使用go get命令来获取,例如:go get github.com/kardianos/govendor ,会将依赖包下载到GOPATH的路径 ...
- 玩转物联网之MQTT
物联网概述 物联网——即Internet-of-Things,其实这个概念由来已久,简单来讲,物联网是物与物.人与物之间的信息传递与控制简称.它和能源.电子信息.医疗.交通.零售.物流.工业制造等行业 ...
- MVC 【Razor 视图引擎】基础操作 --页面跳转,传值,表单提交
ASPX 与 Razor 仅仅是视图不一样. 新建项目----ASP.NET MVC 4 Web 应用程序------选择模板(空).视图引擎(Razor ) 1.视图中 c# 代码 与 HT ...
- failed to install tomcat6 service ,check your setting and permissions
出现的问题: 刚刚重新装了tomcat7,出现提示:Tomcat安装不成功.提示是:failed to install tomcat6 service ,check your setting and ...
- SpringCloud初体验之Eureka
Eureka简介 SpringBoot简化了Spring工程的复杂度,之前复杂的Spring工程被拆分成了一个个小的SpringBoot工程.那么SpringBoot之间如何通讯,相互获取信息呢?这就 ...
- AWT初步— 事件处理模型
之前学习的内容只能形成一个用户界面,而用户不能对其有实际的操作,也就是说用户界面没有任何功能.要能够让图形界面接收用户的操作,就必须给各个组件加上事件处理机制.在事件处理的过程中,主要涉及三类对象: ...