彈性（flex）佈局實現圖片水平垂直居中

			<div class="photo my1">
				<img src="./public/img/1.png">
				<div class="title">
					<a href="">
					<p>雷凌汽車上市發佈會</p>
					<i class="fa fa-search-plus"></i>
					</a>
				</div>
			</div>

代碼中title是遮罩層，鼠標觸碰顯示，因爲每個photo裏面的圖大小都不一樣，實現遮罩層內文字和圖標的居中就可以用display：flex；彈性佈局

水平垂直居中代碼：

.photo .title{
    opacity: 0;
    transition: 1.5s;
    color: white;
    display: flex;
    justify-content:center;水平居中
    align-items: center;垂直居中
}

效果圖：