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. 【使用 DOM】使用 Document 对象

    Document 对象时通往DOM功能的入口,它向你提供了当前文档的信息,以及一组可供探索.导航.搜索或操作结构与内容的功能. 我们通过全局变量document访问Document对象,它是浏览器为我 ...

  2. Win7 64位下sql server链接oracle的方法

    继上一次mysql同步sql server后,这一次需要将Oracle同步到sql server上来,方案相似,只是在sql server链接oracle的时候费了很多时间. 一.测试环境 本方案实现 ...

  3. R语言学习笔记:分析学生的考试成绩

    孩子上初中时拿到过全年级一次考试所有科目的考试成绩表,正好可以用于R语言的统计分析学习.为了不泄漏孩子的姓名,就用学号代替了,感兴趣可以下载测试数据进行练习. num class chn math e ...

  4. Android用路径api在内部存储读写文件

    复制并修改原有项目 复制之前创建的项目CC+CV操作 需要改动的地方: * 项目名字 * 应用包名 * R文件重新导包 接着修改件/AndroidManifest.xml中的包名:package=&q ...

  5. 高精度练习(hdoj1042)

    Problem Description Given an integer N(0 ≤ N ≤ 10000), your task is to calculate N!   Input One N in ...

  6. CSS 指定选择器(十一)

    一.指定选择器 有时个会希望控制某个元素在一定范围内的对象样式,这时就可以把元素与Class或者Id选择器结合起来使用 <!DOCTYPE html PUBLIC "-//W3C//D ...

  7. 最简MacOs10.8安装

    虚拟机中安装Mac Os X的方法网上很多很多,但是对刚接触的朋友来讲肯定不是一件容易的事,这个自己深有体会,包括去年已经装好过,今年再找教程安装都装不起来,期间还出现了各种问题,幸好去年装好之后备份 ...

  8. android 隐藏标题栏

    在onCreate()方法中添加如下代码: public class FirstActivity extends Activity { @Override protected void onCreat ...

  9. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(二)ActionSheet视图 学习笔记

    action动作 sheet表 其实就是一种菜单 参数:1代理:谁去代理它2取消按钮标题3这个按钮标题会自动变成红色4添加设置其他按钮(不想加,设置为nil)   然后我们为这些按钮添加点击事件:   ...

  10. System.Data.Entity 无法引用的问题

    最近刚学MVC,跟着网上的博客学习,发现代码中有这样一句: using System.Data; using System.Data.Entity; 我项目引用的时候,也引用了System.Data. ...