Html 在div标签中左对齐img？

编辑：这可能更有意义，请检查此图像。 图像只是通过填充。我希望标题div垂直展开以容纳图像。在保持文本居中的同时，图像的中心应与文本所在的直线相交

我想在左边对齐一个img，然后在文本后面再对齐一个到右边。我尝试过各种属性，但似乎没有一种做得对。有人能帮忙吗

为了澄清，我希望图像位于屏幕或浏览器窗口的左侧。div从屏幕的左侧延伸到右侧，正如您所期望的标题/标题div一样

浮动；左键似乎使img从div标签中退出。我应该提到有一个文本对齐：居中；属性。但当移除时，它并不能解决问题，所以我不确定是不是这样

HTML

<div id="header">
    <div id="title">
    <h1>
    <img class="logo" src="images/logo.png" alt="" width="86" height="98" />
    <a href="index.html">Page Header Title</a>
    </h1>
    </div>
</div>

用这个

<div id="header" style="float:left">
<div id="title">
<h1>
<img class="logo" src="images/logo.png" width="86" height="98" />
<a href="index.html">Page Header Title</a>
</h1>
</div>

---

我为您创建了一个浅尝辄止的代码示例。我想这就是你想要做的？ CSS:

.logo{
     float:left;
     width: 86px;
     height:98px;
     display:block;    
}

.img2{
    float:right;
    display:block;
}

.clear{
    clear:both;
}

HTML:

徽标从div中脱落的原因是未清除。 这应该能解决问题。

标志{ 显示器：flex； 对正内容：空间均匀； } 你好，世界

---

图像应该放在左边，但是文本应该放在哪里？右边？可能是我误解了你的问题，但我认为你希望你的徽标位于浏览器的最左侧，是吗？那么你需要用-ve值设置左边距，如下所示：

<div id="header">
    <div id="title">
        <h1>
            <img class="logo" src="images/logo.png" alt="" />
            <a href="index.html">Page Header Title</a>
            <img class="img2" src="images/img2.png" alt="" />
            <div class="clear"></div>
        </h1>
    </div>
</div>