（1）html：<div class="flexbox"> <img src="1.jpg" alt=""> </div>css：.flexbox{display: flex;align-items: center} .flexbox img{align-items: center;}flex可能不是实现垂直居中最好的选择，因为IE8,9并不支持它
（2）html：<div class="tablebox"> <div id="imgbox"> <img src="1.jpg" alt=""> </div> </div> css：.tablebox{display: table} #imgbox{display: table-cell;vertical-align: middle;} 如果你也想实现水平居中，你可以给最外层的div元素添加text-align: center属性
（3）html：<div class="posdiv"> <img src="1.jpg" alt=""> </div> css：.posdiv{position: relative;} .posdiv img{width: 100px;position: absolute;top: 50%;margin-top: -50px;}现在我们需要给img元素设置一个负的margin-top值，这个值为你想要实现垂直居中的元素高度的一半，*如果不确定元素的高度，可以不使用margin-top，而是使用transform:translateY(-50%);属性。

文字无缝滚动
html：
<div class="nearwords">
<div class="flexbox">
<p v-for="(item,index) in wordslist" :key="index" class="ntext">{{item}}</p>
</div>
css：
.ntext { animation: myMove 5s linear infinite; animation-fill-mode: forwards; } /*文字无缝滚动*/
@keyframes myMove {
0% { transform: translateY(0); }
100% { transform: translateY(-150px); }
}