没有设置相应的css属性前
设置相应属性之后
Html部分
<span class="test_text" title="此时已莺飞草长 爱的人正在路上
我知他风雨兼程 途经日暮不赏
穿越人海 只为与你相拥">
此时已莺飞草长 爱的人正在路上
我知他风雨兼程 途经日暮不赏
穿越人海 只为与你相拥
</span>
title属性是在鼠标放到这个文本上会显示出来
Css部分
.test_text {
display: block;
width: 200px;
height: 200px;
line-height: 30px;
background-color: aquamarine;
text-align: left;
text-overflow: ellipsis;
// 文本溢出属性指定应向用户如何显示溢出内容
// ellipsis是省略的意思
overflow: hidden;
// overflow 属性规定当内容溢出元素框时发生的事情。
// hidden 内容会被修剪，并且其余内容是不可见的。
white-space: nowrap;
// 规定段落中的文本不进行换行：
}
