把超出的字体设置为省略号

对块元素设置以下三点就OK了

          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;

if you need a example,here are you .

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            li{
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
        </style>
    </head>
    <body>
        <ul>
            <li>111111111111111111111111111111111111</li>
            <li>22222222222222222222222222222222222222222222222</li>
            <li>333333333333333333333333333333333333333333333333333333333333333</li>
        </ul>
    </body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容