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. MVC中提交表单的4种方式

    一,MVC  HtmlHelper方法 Html.BeginForm(actionName,controllerName,method,htmlAttributes){} BeginRouteForm ...

  2. FFmpegInterop 库在 Windows 10 应用中的编译使用

    FFmpegInterop 简介 FFmpegInterop 是微软推出的封装 FFmpeg 的一个开源库,旨在方便在 Windows 10.Windows 8.1 以及 Windows Phone ...

  3. CentOS安装nginx方法命令教程

    1.依赖项和必要组件 yum install -y make cmake gcc gcc-c++ yum install -y pcre pcre-devel yum install -y zlib ...

  4. mysql主从复制报错 :Incorrect usage of DB GRANT and GLOBAL PRIVILEGES

    在配置mysql主从复制时,想通过 grant replication slave on bbs.* to 'bbs'@'192.168.1.3' identified by '123456'; 来限 ...

  5. Java 匿名内部类 & 内部类

    一.JAVA中内部类和匿名内部类的区别 内部类:内部类可以是static的或者非static的,static内部类只能包含静态方法和静态类变量,只能访问外部类的静态元素,内部类可以实例化,多次使用. ...

  6. 对SNMP4J的一些封装

    SNMP4J是一个开源的,用Java实现的snmp协议.其中提供了一下API,在这些API上面封装了一些方法,比如SNMP的get-request请求,get-next-request请求等 如果不了 ...

  7. Windows 10:开机显示C:\WINDOWS\system32\config\systemprofile\Desktop不可用 的解决方法

    今晨起来开机,开完机一看,弹出啦一个框框上面写着“C:\WINDOWS\system32\config\systemprofile\Desktop不可用...” 当我点击了确定之后,发现屏幕一片黑,只 ...

  8. Web前端面试指导(十二):::before 和:before有什么区别?

    题目点评 这个问题看来很简单,但如果之前没有琢磨这个问题,给人感觉也是门头一垂,听到这个题目就懵逼了,因为原来从来没有注意过这个问题,即便有注意这个问题也不能很好的回答清楚.回答的技巧就是从相同点和不 ...

  9. android startActivityForResult()

    举例说我想要做的一个事情是,在一个主界面(主Activity)上能连接往许多不同子功能模块(子Activity上去),当子模块的事情做完之后就回到主界面,或许还同时返回一些子模块完成的数据交给主Act ...

  10. qt中的lineEdit文本输入框的输入类型限制(三种验证类)

    qt的三种验证类: 1.输入int类型 QValidator *validator=new QIntValidator(100,999,this): QLineEdit *edit=new QLine ...