html - 图片旁边的文字不适用于特定图片。为什么？

Question

我使用以下代码将文本放在图像旁边:

<div style="display:inline-block;vertical-align:bottom">
        <p><img src="CIMA/CimaMetanoia.png" alt="Cool"   height="50%" width="50%" /></p>
    </div>

    <div style="display:inline-block;">
        <p class="text"> 
        <div> <font color="#d54646"><b>MOVIDA</b> es un ministerio christiano, latino, internacional <br> e interdenominacional con el propósito de: </font> <br><br> </div>
        <div> <b><font color="#2089a4">DESAFIAR</font></b> <br>al joven christiano a una entrega total a Dios y a crecer en su relación con El.<br><br> </div>
        <div> <b><font color="#2089a4">PROVEERLE</font></b> <br> herramientas para que descubra sus dones y talentos.<br><br> </div>
        <div> <b><font color="#2089a4">MOTIVARLO</font></b> <br> a un servicio comprometido en su iglesia local y movilizarlo a las misiones mundiales.<br> </div>
        </p>
    </div>

但是，即使我改变了图像的大小，它总是在文本之上...为什么？

---

最后我使用了模板“initializr”(参见 google)，因为它也使所有内容都具有响应性，这是我需要的!无论如何，谢谢大家!

Answer 1

您可以尝试将位置属性添加到图像中

所以，在这种情况下，

image{position:fixed , absolute , relative; top:50%; left:50%;}

或者这也可以工作:

<div>
<image></image>
<p></p>
</div>