css3效果
1.长文字隐藏（包括多行和一行）
数据（很长）
此方法只能实现一行省略，多行省略请查看https://www.cnblogs.com/hellman/p/5755376.html
width: 3.35rem;
white-space: nowrap; /*文字不换行*/
text-overflow: ellipsis;
overflow: hidden;title属性
2.hover效果
transform: translate(-0.05rem,-0.05rem); /*2d位移，若用绝对定位改变hover时块的位置，则会一直闪*/
box-shadow: 0 12px 30px -8px rgba(0,0,0,.2);
transition: 0.3s; /*从没有hover过渡到hover用的时间*/
cursor: pointer; /*将鼠标移到块时，鼠标显示为抓手*/以下方法都是transform属性的值，用于对元素进行移动、缩放、转动、拉长或拉伸。
Internet Explorer 10、Firefox 以及 Opera 支持 transform 属性。
Chrome 和 Safari 需要前缀 -webkit-。
注释：Internet Explorer 9 需要前缀 -ms-。
translate() 方法
通过 translate() 方法，元素从其当前位置移动，根据给定的 left（x 坐标） 和 top（y 坐标） 位置参数：
rotate() 方法
通过 rotate() 方法，元素顺时针旋转给定的角度。允许负值，元素将逆时针旋转。
scale() 方法
通过 scale() 方法，元素的尺寸会增加或减少，根据给定的宽度（X 轴）和高度（Y 轴）参数：
skew() 方法
通过 skew() 方法，元素翻转给定的角度，根据给定的水平线（X 轴）和垂直线（Y 轴）参数：
matrix() 方法
matrix() 方法把所有 2D 转换方法组合在一起。
matrix() 方法需要六个参数，包含数学函数，允许您：旋转、缩放、移动以及倾斜元素。
