css处理 单行文字超出 显示省略号

我们再工作中经常会碰见 文章标题过长的 题目 这个时候我们要用到 超出部分显示省略号

<a href="">

  css处理单行文本溢出显示省略号，  css处理单行文本溢出显示省略号，  css处理单行文本溢出显示省略号，  css处理单行文本溢出显示省略号，  css处理单行文本溢出显示省略号，

</a>

经常是碰见a标签包括,当然也有h1-h6 标题标签 和p标签

我这里是拿a标签来举列子 因为我碰见的证是 a标签

如果不设置的话  屏幕上会出现 很长的文字标题 显然不是我们想要的

不说废话了直接上样式

a{    
            display: block;//将a标记变成块级元素
            width: 100px;//宽度设置为100
            overflow: hidden;  //超出则隐藏
            white-space: nowrap;//不设置换行
            text-overflow: ellipsis;//这个是设置省略号
        }

重点是这三个家伙

overflow: hidden;  //超出则隐藏
            white-space: nowrap;//不设置换行
            text-overflow: ellipsis;//这个是设置省略号

最后就实现了 主要是这个样式  单词太难记 但还是经常会碰见 所以建议童鞋把这个记住