问题1、如图红色圈的内容,鼠标移到上面预览
问题2、如图,当某一行数据太长时,后面显示省略号的效果怎么做的,鼠标移上去时能显示完成内容

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head><body>
    <p title="这是一个测试 后边还有东西">这是一个测试...</p>
    </body>
    </html>
    title属性是鼠标移上去显示的信息
      

  2.   

    从你截图来看应该是title~
    在chrome或ff浏览器里右键审查元素就可以看到
      

  3.   

    1. 设定title属性就能实现
    2. 设定div或label内显示最大字符数,之后比较字符串长度,超出部分显示为...
      

  4.   

    加<a>标签,title属性就可以做到
      

  5.   

    第一个问题
    将全部信息存在标签的title属性中,但考虑到有些标签支持不好、长度的限制。
    推荐使用一个非常良好的插件,qtip2 地址http://qtip2.com/demos以下样式实现第二个问题.short{
    width:100px;//设置显示宽度
    display:inline-block;//块级显示才能不换行而且设置宽度
    overflow:hidden;//隐藏超出的部分
    text-overflow:ellipsis;//超出部分显示省略号
    white-space:nowrap;//不换行
    }