一、vertical-align垂直居中

vertical-align 属性经常用于设置图片、表单（行内块元素）和文字垂直对齐。

vertical-align: baseline   ｜   top   ｜   middle   ｜   bottom

二、vertical-align解决图片底部默认空白缝隙问题

缝隙产生原因是行内块元素和文字的基线对齐

解决方案：

（1）给图片添加vertical-align: top｜middle｜bottom

（2）把图片转换为块级元素 display:biock

三、溢出的文字省略号显示

1、单行文字溢出显示省略号——必须满足三个条件

（1）先强制一行显示文本 white-space:nowrap;（默认normal自动换行）

（2）超出部分隐藏  overflow:hidden;

（3）文字用省略号替代超出部分   text-overflow: ellipsis;

2、多行文本溢出显示省略号（推荐后台人员限制）

多行文本溢出显示省略号，有较大兼容性问题，适合于webKit浏览器或移动端（移动端大部分是webkit内核）

弹性伸缩盒子模型     dispaly: -webkit-box;

限制在一个块元素显示文本的行数    -webkit-line-clamp:2;     （例子是第二行开始省略）

设置或检索伸缩盒对象的子元素的排列方式    -webkit-box-orient: vertical;