Html 如何将文本与图片对齐？

我目前正在尝试将文本与图像对齐

以下是我迄今为止所尝试的：

HTML:

 <ul>
  <li>Coffee</li>
  <li>Coffee</li>
  <li>Coffee</li>
</ul>

li
{
list-style-image:url(http://evenimente.academiasuccesului.ro/wp-content/themes/responsive/images/1.png);
margin-left:50px;
}

这是接近我想要的，尽管底部有文本，我正试图将其对齐到中心

---

提前谢谢

您可以使用背景图像

li{
宽度：68px；
高度：68px；
边缘底部：20px；
线高：68px；
显示：块；
背景位置：左上角；
背景尺寸：68px 68px；
背景：url(http://evenimente.academiasuccesului.ro/wp-content/themes/responsive/images/1.png);
文本缩进：86px；
}

咖啡
咖啡
咖啡

您可以使用背景图像来完成。对齐文本并使用行高。关于这一点，有很多答案可以解释不同的方法。您需要浏览并尝试更适合您需要的内容

ulli{
背景图片：url(http://evenimente.academiasuccesului.ro/wp-content/themes/responsive/images/1.png);
背景重复：无重复；
线高：70px；
左侧填充：80px；
}
保险商实验室{
利润率：50像素；
列表样式：无；
}

咖啡
咖啡
咖啡