css icon垂直居中 |css获取tr最好一个

在Web设计中，常常需要使用icon来展示一些重要的信息，比如社交媒体链接、操作按钮等等。但是，许多设计师都有一个问题：如何将icon垂直居中？ 在CSS中，有几种方法可以垂直居中icon。下面是一些常见的方法。 1. 使用line-height属性 使用line-height属性是一种简单而有效的方式来垂直居中icon。将line-height的值设置为元素的高度，就可以实现垂直居中了。

p {
height: 50px;
line-height: 50px;
}

2. 使用padding-top和padding-bottom属性 另一种方法是使用padding-top和padding-bottom属性。将这两个属性的值设置为相等的数值，就可以将内容居中。

p {
height: 50px;
padding-top: 20px;
padding-bottom: 20px;
}

3. 使用display:flex属性 使用display:flex属性也可以实现垂直居中。将父元素的display属性设置为flex，再将子元素的align-items属性设置为center，就可以实现垂直居中了。

div {
display: flex;
align-items: center;
}

4. 使用vertical-align属性 最后一种方法是使用vertical-align属性。将icon设置为inline-block元素，再将父元素的vertical-align属性设置为middle，就可以实现垂直居中了。

span {
display: inline-block;
vertical-align: middle;
}

以上是一些常见的方法来实现icon的垂直居中。根据实际情况，你可以选择其中的任何一种方法来解决你的问题。