当文本溢出包含的元素时加省略号之text-overflow
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的更多相关文章
- 可编辑div中包含子元素时获取光标位置不准确的问题
前言: 高亮显示输入框中的关键字符,这就必须得用到可编辑div(或其他标签)元素了,这时我们需要获取光标的位置,以便插入字符. 正文: 正常情况下获取光标位置,代码如下: function getPo ...
- ZH奶酪:HTML元素文本溢出显示省略号(...)
一 单行文本 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; overflow 属性规定当内容溢出元素框时发生的事情. ...
- css 文本单行显示溢出时出现省略号 多行显示溢出时出现省略号 首行缩进
一.文本单行显示溢出时出现省略号 二.文本多行显示溢出时出现省略号(这种样式只能在webkit和移动端使用,包括小程序,不能设置固定高度) 三.首行缩进两字符 text-indent: 2em; 四. ...
- 浅谈文本溢出省略号代表修剪text-overflow
一.示例 图片显示: HTML结构: CSS样式: 注意: CSS3 text-overflow 属性规定当文本溢出包含元素时发生的事情,其中 所有浏览器都支持 white-space 属性. 示例 ...
- 长文本溢出显示省略号(…) text-overflow: ellipsis
text-overflow 属性规定当文本溢出包含元素时发生的事情. 默认值: clip 继承性: no 版本: CSS3 JavaScript 语法: object .style.textOverf ...
- CSS ... 文本溢出用省略号代替
{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap } text-overflow 属性规定当文本溢出包含元素时发生的事情. c ...
- CSS-盒模型与文本溢出笔记
注意点: 文本居中: text-align:center:文本左右居中 line-heigh:30px; 等于容器高度时,单行文本上下居中 margin:0 auto: 浏览器居中 清除margin ...
- JS判断数组是否包含某元素
我在学习ES6数组拓展时,发现了新增了不少了有趣的数组方法,突然想好工作中判断数组是否包含某个元素是非常常见的操作,那么这篇文章顺便做个整理. 1.for循环结合break 可能很多人第一会想到for ...
- css:在容器内文字超过容器范围,显示一行加省略号或者两行加省略号
一.显示一行加省略号:各浏览器兼容 .box{ width: 100px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } ...
随机推荐
- javascript数组浅谈1
最近心血来潮要开始玩博客了,刚好也在看数组这块内容,第一篇就只好拿数组开刀了,自己总结的,有什么不对的地方还请批评指正,还有什么没写到的方面也可以提出来我进行完善,谢谢~~ 首先,大概说说数组的基本用 ...
- DownloadManager 的使用
一.基本概念 1.DownloadManager是Android 2.3A (API level 9) 引入的,基于http协议,用于处理长时间下载. 2.DownloadManager对于断点 ...
- Android 计算布局背景的透明度
1.#ff000000 此为16进制颜色代码,前2位ff为透明度,后6位为颜色值(000000为黑色,ffffff为白色,可以用ps等软件获取). 2.透明度分为256阶(0-255),计算机上用16 ...
- MVC.Net: 解决Attempted to access an unloaded appdomain的问题
在C#中尝试获取AD帐号信息时,会随机出现Attempted to access an unloaded appdomain的问题,解决方法如下: 将 principalContext = new P ...
- Wing IDE 5 的破解
Wing IDE 百度百科 1.安装好Python,已测的是Python 2.7.10: 2.新建一个py文件CalcActivationCode.py(名字自己随便取): 3.CalcActivat ...
- python arguments *args and **args ** is for dictionaries, * is for lists or tuples.
below is a good answer for this question , so I copy on here for some people need it By the way, the ...
- JavaScript Patterns 2.11 Writing Comments
Document all functions, their arguments and return values, and also any interesting or unusual algor ...
- 问题解决——OpenGL超级宝典 关于gltDrawTorus的错误解决
看OpenGL超级宝典的时候,遇到一个函数 “gltDrawTorus”,在TRANSFORM和SPHEREWORLD中都有用到.但是一开始在自己写示例代码里时却没法使用,而在作者的代码目录结构下却可 ...
- Android开发之 Windows环境下通过Eclipse创建的第一个安卓应用程序(图文详细步骤)
第一篇 windows环境下搭建创建的第一个安卓应用程序 为了方便,我这里只采用了一体包进行演示. 一.下载安卓环境的一体包. 官网下载:安卓官网(一般被墙了) 网盘下载: http://yunpa ...
- 烂泥: KVM虚拟机Linux系统增加硬盘
本文由秀依林枫提供友情赞助,首发于烂泥行天下. Linux虚拟机在使用过程中,硬盘空间不够使用.由于前期没有做LVM,所以只能手动添加新的硬盘. 给虚拟机添加硬盘有两种方法: 1.通过virsh at ...