zoukankan html css js c++ java

内容过长显示省略号鼠标悬停显示

<!doctype html>
<html>

    <head>
        <style type="text/css">
                        //css控制内容过长显示省略号和悬停时显示全部内容
            .li1 {
            list-style:none;
            width:200px;
            white-space:nowrap;
            text-overflow:ellipsis; 
            -o-text-overflow:ellipsis; 
            overflow: hidden;
            margin-top:5px; }

            .li2{
            list-style:none;
            margin-top:5px;
            }
        </style>
    </head>

    <body>
        <ul>
            <li class="li1" onmouseover="this.className='li2'" onmouseout="this.className='li1'"><a href="#">内容过长显示省略号 鼠标悬停显示1</a></li>
            <li class="li1" onmouseover="this.className='li2'" onmouseout="this.className='li1'"><a href="#">内容过长显示省略号 鼠标悬停显示2</a></li>
            <li class="li1" onmouseover="this.className='li2'" onmouseout="this.className='li1'"><a href="#">内容过长显示省略号 鼠标悬停显示3</a></li>
            <li class="li1" onmouseover="this.className='li2'" onmouseout="this.className='li1'"><a href="#">内容过长显示省略号 鼠标悬停显示4</a></li>
            <li class="li1" onmouseover="this.className='li2'" onmouseout="this.className='li1'"><a href="#">内容过长显示省略号 鼠标悬停显示5</a></li>
        </ul>
    </body>

</html>

查看全文

相关阅读:
OnClick方法与Click事件
 词法，语法，语义
 静态成员与实例成员
 依赖属性 DependencyProperty
依赖，关联，聚合，合成
 数据可视化
 ref 与out
理解TCP为什么需要进行三次握手(白话)
禁止访问网站中所有的动态页面
 linux 重命名文件和文件夹

原文地址：https://www.cnblogs.com/ShanHeDiao/p/4814075.html

内容过长显示省略号 鼠标悬停显示

内容过长显示省略号鼠标悬停显示