Question

编辑：这可能更有意义，请检查此图片。 http://puu.sh/rt8M 图像刚刚经过填充。我希望标题div垂直扩展以适应图像。保持文本居中，图像中心应与文本所在的线相交。

我想将img向左对齐（然后在文本右侧对齐另一个）。我尝试了各种属性，但似乎都没有做对。有人可以帮忙吗？

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

Float; left似乎让img从div标签中删除。我应该提一下text-align：center;标签上的属性。但它在删除时无法解决问题，所以我不确定是不是。

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>

Answer 1

使用此

<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>

Answer 2

我为你创建了一个小的dabblet代码示例。我想这就是你要做的事情？ http://dabblet.com/gist/2492793

Answer 3

CSS：

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

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

.clear{
    clear:both;
}

HTML：

<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>

徽标退出div的原因是因为它没有被清除。这应该解决问题。

Answer 4

int main(){
    int x;
    int y = 1;
    int minNumber = min(x,y);
    cout << minNumber;
    return 0;
}

#logo{
  display: flex;
  justify-content: space-evenly;
}

对齐div标签中剩下的图像？

4 个答案: