Css实现省略号...及悬浮层显示全部内容的方法：

1、单行文本省略：

overflow: hidden;//溢出隐藏
white-space: nowrap;//禁止换行
text-overflow: ellipsis;//...

2、多行文本省略：

display: -webkit-box;//谷歌
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;//显示几行
overflow: hidden;

注：

英文自动换行：
	word-wrap:break-word;
	word-break:break-all;

3、Vue中实现鼠标移入，省略号的内容全部显示：

（1）Vue的ElementUI组件

<p>{{item.title}}</p>
改为：
//法1
<el-tooltip :content="item.title" placement="top-start">
	<p>{{item.title}}</p>
</el-tooltip>   //悬浮层显示全部内容

//法2
<p :title="item.title">{{item.title}}</p>

（2）Table表格

<el-table-column prop="name" label="姓名" :show-overflow-tooltip="true">
//:show-overflow-tooltip="true"    //悬浮层显示全部内容

4、html实现省略号全部显示：

<div title="11111">11111</div>    //title属性（title的内容与该内容相同）悬浮层显示全部内容

5、css实现省略号全部显示：

1、设置:hover
h4{
	overflow: hidden;//溢出隐藏
	white-space: nowrap;//禁止换行
	text-overflow: ellipsis;//...
}
h4:hover{
	width:200px;
	overflow: visible;
	white-space: pre-line;
	cursor:pointer;
}
2、display：block与display：none