VUE图标与文字对不齐的问题

Question

我使用vue，在右上角显示用户名和图标，代码如下，但图标太靠上，应该与用户名水平中心对齐。该怎么修改代码呢？

    <div class="right-menu" style="padding-right:30px;">
      <img src="@/icons/user.png" style="width:30px; height:30px;alignment: center;">{{ showUserName }}</img>
    </div>

显示效果：

Answer 1

你这个与 VUE 没半毛钱关系。
只是 CSS 方面的问题，加个样式就好：

<div class="right-menu" style="padding-right:30px;">
    你好<img src="https://img-home.csdnimg.cn/images/20201124032511.png" 
      style="width:30px; height:30px;alignment: center;vertical-align:middle;">你好</img>
</div>