本文操作环境:windows7系统、html5&&css3版,dell g3电脑
css实现文本超过部分,超出两行,超出部分省略号显示
文字超过部分显示为省略号
<style>.p{ width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}</style><body> <p class="p"> 我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本 </p></body>
文本超出两行,超出部分省略号显示
<style>.p{ width: 200px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; /* 这里是超出几行省略 */ overflow: hidden;}</style><body> <p class="p"> 我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本我是一个文本 </p></body>
推荐学习:《css视频教程》
以上就是css怎么实现超出两行显示省略的详细内容。
