动态font-size下的图片垂直居中效果实例页面

展示

代码

• HTML：

  <p>文字 <img src="delete.png"></p>

• CSS：

  p {
      font-size: 14px;
      animation: fontSize 5s infinite alternate ease-in-out;
  }
  p > img {
      width: 16px; height: 16px;
      /* 下面的ex实现是为了方便大家对比效果 */
      /* vertical-align: .6ex; */
      vertical-align: 25%;
      position: relative;
      top: 8px;
  }
  @keyframes fontSize {
      to {
          font-size: 60px;
      }
  }