a{  
       width: 80px;/* 要显示文字的宽度 */  
       float: left;/* 左对齐,不设置的话只在IE下好用 */  
       overflow: hidden; /* 超出的部分隐藏起来 */  
       white-space: nowrap;/* 不显示的地方用省略号...代替 */  
       text-overflow: ellipsis;/* 支持 IE */  
       -o-text-overflow: ellipsis;/* 支持 Opera */  
}

例:

<div style="display: inline-block;overflow: hidden;width: 50px;word-break: keep-all;white-space: nowrap;text-overflow: ellipsis;line-height: 28px;float: left;">dfdsfdsfffffffffffffffffffff</div>

html 固定长度 超出长度 显示省略号的更多相关文章

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

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

  2. css 超出部分显示省略号

    代码: overflow: hidden; white-space: nowrap;  text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...

  3. CSS实现单行、多行文本超出部分显示省略号

     单行文本超出,代码如下: css代码: <style> .one{ width:200px; overflow: hidden; text-overflow:ellipsis; whit ...

  4. Table组件设置文字超出宽度显示省略号,鼠标悬停以悬浮框显示

    一.设置文字超出宽度显示省略号 注意点: 1.  需要指定column的width属性,否则列头跟内容可能不对齐.需要留一列不设置宽度以适应弹性布局. 2. 列宽度width必须大于ellipsis的 ...

  5. HTML5 元素文字超出部分显示省略号(支持多行),兼容几乎所有常用浏览器

    1,公共样式,在公共的 CSS 文件中加入以下内容  /* 超出部分显示省略号,支持多行 */ .text-ells:before { content: ''; float: left; width: ...

  6. css文字超出自动显示省略号

    只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...

  7. JS控制文字只显示两行,超出部分显示省略号

    由于使用css控制文字只显示多行,超出部分显示省略号,存在一定的兼容性问题,所以总结了一下网上一些大咖使用js实现控制行数的解决方案. 第一步:依次引入jquery.js+jquery.ellipsi ...

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

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

  9. CSS——文本超出隐藏显示省略号

    文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...

  10. css限制显示字数,文字长度超出部分用省略号表示【转】

    为了保证页面的整洁美观,在很多的时候,我们常需要隐藏超出长度的文字.这在列表条目,题目,名称等地方常用到. (1).文字超出一行,省略超出部分,显示'...' 如果这种情况比较多,可以取一个切合作用的 ...

随机推荐

  1. 代码重构----使用java有限状态机来消除太多的if else判断

    1. 状态机基本概念 http://zh.wikipedia.org/wiki/%E6%9C%89%E9%99%90%E7%8A%B6%E6%80%81%E6%9C%BA 状态存储关于过去的信息,就是 ...

  2. Class.forName和ClassLoader的区别

    一 看名字就知道了,一个是类的创建,一个类加载器 二 再看下Class.forName源码,调用了ClassLoader @CallerSensitive public static Class< ...

  3. Spring Cloud Ribbon负载均衡配置类放在Spring boot主类同级增加Exclude过滤后报Field config in com.cloud.web.controller.RibbonConfiguration required a bean of type 'com.netflix.client.config.IClientConfig' that could not b

    环境: Spring Cloud:Finchley.M8 Spring Boot:2.0.0.RELEASE 目录结构: 可以看到代码第13行的注释,我已经在@ComponentScan注解中添加了E ...

  4. shutil模块——高级的文件、文件夹、压缩包处理模块

    将文件内容拷贝到另一个文件 shutil.copyfileobj('fsrc', 'fdst', 'length') 方法源码: def copyfileobj(fsrc, fdst, length= ...

  5. maven项目的创建

    ·做了两年多Java Web一多半的项目都是SSM架构的,只搭建过两次,趁着周末做个总结整理. Eclipse搭建Maven项目 1.new project  --> Maven project ...

  6. javascript12个你必须掌握的技能

    网站建设的时候,作为码农,总喜欢写一些高效且省事的代码,这里,dbestech为你提供关于JavaScript的使用技巧点. 1. 空(null, undefined)验证 当我们创建了一个新的变量, ...

  7. em和px

    在国内网站中,包括三大门户,以及“引领”中国网站设计潮流的蓝色理想,ChinaUI等都是使用了px作为字体单位.只有百度好歹做了个可调的表率.而 在大洋彼岸,几乎所有的主流站点都使用em作为字体单位, ...

  8. Stage5--Python GUI编程TKinter

    Python图形库简要介绍 python提供了多个图形开发界面的库,几个常用Python GUI库如下: Tkinter: Tkinter模块("Tk 接口")是Python的标准 ...

  9. lLinux安装JDK

    1.在Linux中新建文件夹  mkdir /usr/local/java 2.上传jdk-7u55-linux-i586.tar到Linux中 3.解压文件  tar xzvf jdk-7u55-l ...

  10. QBC(Query By Criteria) QBE (Query By Example)

    QBC  参考:(Hibernate的QBC查询) //is empty and is not empty @Test public void testQBC(){ Session session = ...