html span文本和图像向右对齐，但两者都向左对齐

7xllpg7q 于 2022-12-16 发布在其他

关注(0)|答案(1)|浏览(153)

这是我正在努力做的：

这只是一个简单的对齐方式，但是如果我将图像浮动到右侧，那么如果我先放置文本，则图像会转到另一侧
https://jsfiddle.net/3gc0qjzo/

<span>
      <img src="img"/>
      <p>Learn More<p>
</span>

span img {
  float: right;
}
span p {
  display: block;
}

如果我把图像放在第一位，然后是文本，并做一个float:left;，它的工作找到，但我不知道如何对齐他们两个，如果图像去最后。

1条答案

您可以使用Flex

span{
     display:flex;
     flex-direction:row;
     align-items:center; 
   }