小图标与文字对齐

  1. 文字前面加小图标时默认是对不齐的,此时可以利用垂直居中的方法进行对齐。
  2. 效果图如下:
  • 图标大小:19*19
  • 父容器高度:19
  • 图标用<span></span>标签包起来,然后设置垂直居中
  1. 核心代码:
<div style="padding: 10px; color: #888; height:19px; maxHeight:19px; display: flex; justify-content: space-between; ">
    <div>评论区</div>
    <div>
      <span style="vertical-align:middle;">
        <img src="./edit.png" />
      </span> 
      评价
    </div>
</div>
posted @ 2022-01-25 10:55  Freakzzz  阅读(145)  评论(0编辑  收藏  举报