时间戳

首页 > 解决方案 > Html：如何将两个图像放在另一个上面与文本在同一行中？

html - Html：如何将两个图像放在另一个上面与文本在同一行中？

问题描述

有没有办法将两个图像放在另一个上面与文本在同一行中？此示例为三行，第二行在“文本”字样之后有两个图像，一个在另一个之上，然后正常继续文本？是否使用 css 或表格或任何东西？

在此处输入图像描述

我尝试将它们放在 div 或图像块中，但不知道如何实现它。它们可以在表格单元格中一个一个放在另一个之上，但是表格不会与文本并排，它们可以在段落的右侧或左侧浮动，而不是在我认为的中间。

示例图片链接：1、2。如果可能的话，您可以使用它们在 jsfiddle.net 或其他东西中进行演示。

标签： htmlcssimagetext

解决方案

使用line-height和display:inline-block

p{
  line-height:40px;
  
}
span{
  display:inline-block;
  vertical-align:middle;
}
img{
  width:20px;
  display:block;
}
<p>Is there a way to put two images one above the other in the same line with text? This example for three lines, and the second line has two images one above the other after <span><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ_-6FYKDSRJ2Qz8CTZLADbDgHmPaGKQjBMhbCqgEbgR7YkR7mS"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTZYEcLppt4iu9tRNmH0KpP-_AZL62ZSgk8P36_4jG--MMXRg1xag"></span> the words "of text" and then continue the text normally? whether using css or a table or anything?</p>

推荐阅读