text-overflow是css3的属性,用来处理文本溢出,默认裁剪处理,text-overflow属性只能用于block和inline-block元素,内联的和box,flex-flow:column不适用,因为对流动放向为column的box只能设高度,不能设宽度,一切不能设宽的属性都不适用text-overflow属性,对应的js属性为eleObject.style.textOverflow

用法:

div{

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

}

当文本溢出包含的元素时加省略号之text-overflow的更多相关文章

  1. 可编辑div中包含子元素时获取光标位置不准确的问题

    前言: 高亮显示输入框中的关键字符,这就必须得用到可编辑div(或其他标签)元素了,这时我们需要获取光标的位置,以便插入字符. 正文: 正常情况下获取光标位置,代码如下: function getPo ...

  2. ZH奶酪:HTML元素文本溢出显示省略号(...)

    一 单行文本 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; overflow 属性规定当内容溢出元素框时发生的事情. ...

  3. css 文本单行显示溢出时出现省略号 多行显示溢出时出现省略号 首行缩进

    一.文本单行显示溢出时出现省略号 二.文本多行显示溢出时出现省略号(这种样式只能在webkit和移动端使用,包括小程序,不能设置固定高度) 三.首行缩进两字符 text-indent: 2em; 四. ...

  4. 浅谈文本溢出省略号代表修剪text-overflow

    一.示例 图片显示: HTML结构: CSS样式: 注意: CSS3 text-overflow 属性规定当文本溢出包含元素时发生的事情,其中 所有浏览器都支持 white-space 属性.  示例 ...

  5. 长文本溢出显示省略号(…) text-overflow: ellipsis

    text-overflow 属性规定当文本溢出包含元素时发生的事情. 默认值: clip 继承性: no 版本: CSS3 JavaScript 语法: object .style.textOverf ...

  6. CSS ... 文本溢出用省略号代替

    { overflow:hidden; text-overflow:ellipsis; white-space:nowrap } text-overflow 属性规定当文本溢出包含元素时发生的事情. c ...

  7. CSS-盒模型与文本溢出笔记

    注意点: 文本居中: text-align:center:文本左右居中 line-heigh:30px;  等于容器高度时,单行文本上下居中 margin:0 auto: 浏览器居中 清除margin ...

  8. JS判断数组是否包含某元素

    我在学习ES6数组拓展时,发现了新增了不少了有趣的数组方法,突然想好工作中判断数组是否包含某个元素是非常常见的操作,那么这篇文章顺便做个整理. 1.for循环结合break 可能很多人第一会想到for ...

  9. css:在容器内文字超过容器范围,显示一行加省略号或者两行加省略号

    一.显示一行加省略号:各浏览器兼容 .box{ width: 100px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } ...

随机推荐

  1. mongodb 基本指令学习

    启动 : 1)创建一个文件夹存放mongodb的数据  启动的时候指定这个文件夹为存储mongodb的存储路径  我的目录是D:\data 2)启动mongodb服务  进入安装mongodb的bin ...

  2. 关于IE处理margin和padding值超出父元素高度的问题

    两个div,父div有padding值,子div有margin-top值,浏览器在解析实际父子位置关系时,他们之间的距离是父padding+子margin-top.现在把父div设置固定高度,并有意让 ...

  3. Mysql之执行计划

    1.explain分析sql语句 例如: EXPLAIN )  ORDER BY bi.`publish_time`  返回结果: 而今天检查的不是这条sql,远比这条复杂,不过也能反映情况了. (1 ...

  4. JavaScript正则表达式小记

    RegExp.html div.oembedall-githubrepos{border:1px solid #DDD;border-radius:4px;list-style-type:none;m ...

  5. 初学Node(四)事件循环

    Node中的事件循环 事件循环是Node的核心,正是因为有了事件循环JS才能够在服务端占有一席之地.JS是一种单线程语言,但是它的执行环境是多线程的在加上JS的事件驱动这一特点,使使JS在执行的过程中 ...

  6. 深入底层逆向分析TDC‘s keygenme(手脱压缩壳)

    系统 : Windows xp 程序 : TDC‘s keygenme 程序下载地址 :http://pan.baidu.com/s/1gdWyt6z 要求 : 脱壳 & 注册机编写 使用工具 ...

  7. Jmeter代理录制脚本

    录制的原理: 1.LR/Jmeter录制是针对网络通讯协议层面的,它只关心客户端与服务器端的通讯包2.LR/Jmeter的并发测试实际上就是并发客户端与服务器端的通讯过程3.压力是通过多进程/多线程方 ...

  8. 使用SoapUI做webservice的模拟系统实例

    实现步骤: 1.打开SoapUI工具,导入工程文件 2.右键生成一个模拟服务 3.由于要考虑到不同的输入返回不同的输出,因此需要写脚本对输入报文进行解释,然后针对输入来判断返回 3.1.建立不同的返回 ...

  9. Asp.net 页面访问模板页的属性

    首先 页面需要添加下面一段代码 <%@ MasterType VirtualPath="~/User/User.Master" %> 添加的位置如图 这样就可以在这个页 ...

  10. Eclipse 一直提示 loading descriptor for 的解决方法

    启动eclipse之后,进行相关操作时,弹出界面,提示:loading descriptor for xxx 解决方法: 在Eclipse左侧的Project Explorer 最右上角有一个小钮,鼠 ...