CSS中的垂直居中屬性一直是網頁設計中的難點，尤其是在處理動態元素和瀑布式布局時更為常見。下面我們來介紹幾種常用的垂直居中屬性。

/*1.使用display和margin實現*/
.parent{
display: flex;
align-items: center;
}
/*2.使用position和transform實現*/
.parent{
position: relative;
}
.child{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/*3.使用flexbox實現*/
.parent{
display: flex;
align-items: center;
justify-content: center;
}
/*4.使用 table-cell實現*/
.parent{
display: table;
}
.child{
display: table-cell;
vertical-align: middle;
}
/*5.使用line-height實現*/
.parent{
height: 100px;
line-height: 100px;
}
.child{
display: inline-block;
vertical-align: middle;
}
/*6.使用padding實現*/
.parent{
position: relative;
padding-top: 50px;
padding-bottom: 50px;
}
.child{
position: absolute;
top: 50%;
transform: translateY(-50%);
}

以上是一些實現垂直居中的方法，不同的場景和需求可以使用不同的方法來實現。祝菜鳥們早日掌握垂直居中技巧！