在开发中出于对网站页面的美观考虑，前端工程师会经常遇到这样的一个需求，就是文本溢出时显示省略号，这个问题也频繁的出现在前端开发的面试中，今天我们就说一下怎么实现这个需求。
2、具体的实现代码如下：width: 300px;overflow: hidden;white-space:nowrap;text-overflow: ellipsis;
2、具体的实现代码如下：width:300px;（设醅呓择锗置宽度）overflow: hidden;（超出隐藏）text-overflow:ellipsis;（显示省略号）display: -webkit-box;-webkit-line-clamp: 2;（行数）-webkit-box-orient: vertical;
4、<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" type="text/css" href="css/style.css"/> </head> <body> <p id="test">吉安科技计划的喀什的健康和大家按开始登记卡圣诞节可视对讲爱神的箭卡仕达就开始大家按开始登记卡十大健康阿萨德会尽快三季度卡上登记卡号大街上大师抠脚大汉吉安科技计划的喀什的健康和大家按开始登记卡圣诞节可视对讲爱神的箭卡仕达就开始大家按开始登记卡十大健康阿萨德会尽快三季度卡上登记卡号大街上大师抠脚大汉</p> </body> <script type="text/javascript"> function mitulineHide(num,con){ var contain = document.getElementById(con); console.log(con); var maxSize = num; var txt = contain.innerHTML; if(txt.length>num){ console.log('1'); txt = txt.substring(0,num-1)+"..."; contain.innerHTML = txt; } }; mitulineHide(20,'test');</script></html>
