需要对div或者span同时应用Css：

text-overflow:ellipsis;

white-space:nowrap;

overflow:hidden;

即可实现所想要得到的溢出文本显示省略号效果。

当然了你的页面元素要设置固定的宽度，超出了宽度才会显示。

HTML超出文本显示省略号...[text-overflow]的更多相关文章

  1. CSS实现不换行/自动换行/文本超出隐藏显示省略号

    在写页面的时候,我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧! 1.自动换行 div{ word-wrap:break-word; word ...

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

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

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

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

  4. CSS3：text-overflow实现文字截取，超出部分显示省略号

    1. 概述 使用text-overflow:ellipsis对溢出文本显示省略号有两个好处, 一是不用通过后端程序截取: 二是有利于SEO. 2. text-overflow的属性 clip: 当对象 ...

  5. CSS 单行溢出文本显示省略号...的方法（兼容IE FF）（转）

    http://www.52css.com/article.asp?id=602 ===================================================     html ...

  6. css 溢出文本显示省略号

    这个标题其实已经是一个老生常谈的问题了.很多时候,比如网站最基本的文章列表,标题会很长,而显示列表的区域宽度却没有这么宽,这时候最正常的做法就是 让超出宽度的部分文字用省略号(…)来表示.通常做法是网 ...

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

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

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

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

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

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

随机推荐

  1. APP接口版本兼容的问题

    现在基本每个公司都做APP,所以大家都面临 APP接口版本兼容的问题. iOS和android 要不断开发新版本,很多服务端开发都是在以前接口的逻辑上进行修改.新的APP和接口开发后,接口如何兼容老的 ...

  2. jquery获取当前元素的坐标

    jquery获取当前元素的坐标 1,获取对象 var obj = $("#id号"); 或  var obj = $(this); 实例中我获取的对象是弹出窗口按钮,这样创建的新窗 ...

  3. The IAR Archive Tool—iarchive

    The IAR Archive Tool—iarchive—creates and manipulates a library (anarchive) of several ELF object fi ...

  4. C# ASP.NET Webservice调用外部exe无效的解决方法

    最近用asp.net做webservice,其中有个功能是调用执行外部的exe(类似cmd中执行),但执行Process.Start之后就没有结果,同样代码在winform下正常,折腾两天终于找到解决 ...

  5. mina高并发短连接导致java.io.IOException: Too many open files解决方案

    http://marsvaadin.iteye.com/blog/1698924 mina性能测试 http://hi.baidu.com/rendong/item/bb5d2b0e4563c76dd ...

  6. Gmail POP3设置

    好几个同事在问我怎样使用ThunderBird和OE收取IT CHT的邮箱,因为IT CHT就是用Gmail的功能,因此收发邮件是跟Gmail一样,下面是Gmail的POP&SMTP的设置方法 ...

  7. 实战项目：通过当当API将订单抓取到SAP(一)

    公司在当当上经营了一家店铺,通过当当提供的API,用C#写代码,通过NCO3.0调用SAP RFC将订单信息抓取到SAP. 如果你是新手,在当当网上有店铺,且你公司使用SAP系统,恭喜你,下面这些代码 ...

  8. Codeforces Beta Round #18 (Div. 2 Only) C. Stripe 前缀和

    C. Stripe Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/problemset/problem/18/C ...

  9. Codeforces Round #307 (Div. 2) C. GukiZ hates Boxes 贪心/二分

    C. GukiZ hates Boxes Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/551/ ...

  10. 【摘要】获得HTML元素的绝对位置

    function findAbsolutePosition(obj) { var curleft = curtop = 0; if (obj.offsetParent) { do { curleft ...