zoukankan      html  css  js  c++  java
  • 文字内容溢出用点点点(...)省略号

    我们在项目中一直都是使用JS来控制如果文字内容超过的时候,用...来表示,其实是可以通过CSS来控制的,

    下面提供几种办法

    测试的浏览器:ie6,ie7,ie8,chrome17 ,firefox10

    1)css方法

      text-overflow-fag{

      500px; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden;

      }

    该方法在ie6,7,8 chrome17,firefox10 下均测试通过

    2)网上别人提供的一个负margin定位的方法,我觉得比较好。

      其原理是将(...)使用负margin的方式隐藏在div的上面,使用右浮动的方式,文字使用左浮动的方式隐藏,如果文字过长,就是将...给挤下来

      一个技巧就是(...)所在div的高度要比负margin大一点,为什么呢?这就是一个钩子,一旦超过长度,就将上面的(...)给挤下来了。

  • 相关阅读:
    在Eclipse中设置中文JavaDOC
    买车,给点建议和意见
    父亲节
    JSP文件上传

    昨天我生日
    换皮了
    西安夕阳
    WinForms中只能输入数字的文本框
    使用GoogleCode SVN服务
  • 原文地址:https://www.cnblogs.com/yupeng/p/2404028.html
Copyright © 2011-2022 走看看