代码如下:

<div style="width:100px;height:20px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; ">a b c d e f g h i j k l , msa sd sd sa w df f </div>

text-overflow属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden)。只有这样才能实现溢出文本显示省略号的效果。

一、仅定义text-overflow:ellipsis; 不能实现省略号效果。  

二、定义text-overflow:ellipsis; white-space:nowrap; 同样不能实现省略号效果  

三、同时应用: text-overflow:ellipsis; white-space:nowrap; overflow:hidden; 可实现所想要得到的溢出文本

CSS控制文本的长度,超过一行显示省略号的更多相关文章

  1. CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行

    CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow {     display:block;/*内联对象需加*/     ...

  2. css 字数超过一行显示省略号

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

  3. 问题:css 自动换行;结果:CSS控制文本自动换行

    CSS控制文本自动换行 CSS控制文本自动换行,阅读CSS控制文本自动换行,1.你定死表格的宽度,即给表格一个宽度值(是 数值,不是百分比) 2.强制不换行div{//white-space:不换行; ...

  4. JS控制文本框中的密码显示/隐藏功能

    <html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <s ...

  5. 复习-css控制文本字体属性

    css控制文本字体属性 font-family:字体系列,如”serif“”sans-serif“ font-size:尺寸 font-style:字体样式,如“normal,italic(斜体).o ...

  6. css文本强制两行超出就显示省略号,不显示省略号

    1. 强制一行的情况很简单 overflow:hidden; //超出的隐藏 text-overflow:ellipsis; //省略号 white-space:nowrap; //强制一行显示 2. ...

  7. TextView设置最多显示指定个字符,超过部分显示...(省略号)

    今天在公司遇到一个需求:TextView设置最多显示8个字符,超过部分显示...(省略号),网上找了很多资料,有人说分别设置TextView的android:signature="true& ...

  8. 超过两行显示省略号 -webkit-line-clamp、-webkit-box-orient vue打包后不起作用

    为了实现两行显示缩略显示,但是本地是可以显示,打包后不起作用 word-break: break-all; text-overflow: ellipsis; display: -webkit-box; ...

  9. css控制标题长度超出部分显示省略号

    width: 50px; overflow:hidden;white-space:nowrap; text-overflow:ellipsis; 设置或检索是否使用一个省略标记(...)标示对象内文本 ...

随机推荐

  1. HDU 4746 Mophues【莫比乌斯反演】

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=4746 题意: 1≤x,y≤n , 求gcd(x,y)分解后质因数个数小于等k的(x,y)的对数. 分 ...

  2. Java方法中传值和引用传递的问题(转)

    说明:标题其实说法是错误的.Java中只有值传递,没有引用传递. ... ... //定义了一个改变参数值的函数 public static void changeValue(int x) { x = ...

  3. Jenkins使用Pipeline插件实现多个Job之间的串并联(教程收集)(待实践)

    在原始不使用插件时,在Jenkins我们要实现多个Job之间的连续集成时,我们一般的做法就是在每个Job上关联另一个Job,但是,这样做有个弊端,只能是连续的,如果要实现串或并联这样的,估计比较难:但 ...

  4. sql server trace

    http://www.cnblogs.com/zhijianliutang/p/4113911.html http://www.cnblogs.com/studyzy/archive/2009/01/ ...

  5. 【spring data jpa】repository中使用@Query注解使用hql查询,使用@Param引用参数,报错:For queries with named parameters you need to use provide names for method parameters. Use @Param for query method parameters, or when on

    在spring boot中, repository中使用@Query注解使用hql查询,使用@Param引用参数 如题报错: For queries with named parameters you ...

  6. springMVC前后端分离开发模式下支持跨域请求

    1.web.xml中添加cors规则支持(请修改包名) <filter> <filter-name>cors</filter-name> <filter-cl ...

  7. spring secrity 一些常用小知识

    1.在JSP页面获取当前登录的用户名的方法 首先引入taglib:<%@ taglib prefix="sec" uri="http://www.springfra ...

  8. 浅析nodejs的buffer类

    1.什么时候该用buffer,什么时候不该用 看一下如下的测试代码,分别是拼接各种不同长度的字符串,最后直接拼接了10MB的字符串 var string,string2,string3; var bu ...

  9. ElasticSearchserver操作命令

    在win7环境,进入elasticsearch安装文件夹的bin文件夹: 1. elasticsearch.bat 就能够启动elasticsearch了.执行这个插件的优点是:elasticsear ...

  10. 【每日Scrum】第六天(4.16) TD学生助手Sprint1阶段性成果

    TD学生助手Sprint1阶段性成果(4.16) 任务看板 站立会议内容 组员 昨天 今天 困难 签到 刘铸辉 (组长) 和叶姐,静姐修改页面布局和图片显示,保证界面的亲切. 和大家一起做演示PPT, ...