思路:icon和文字设置成inline-block,搭配flex的align-items: center;即可轻松实现图标和文字的垂直居中。
html:
style:
#box{
border: 1px solid #ccc;
display: flex;
align-items: center;
}
#icon{
display: inline-block;
font-size: 20px;
}
#icon:before {
content: "\e7ca";
}
span{
display:inline-block;
font-size: 50px;
align-items: center;
}