Question

我的HTML结构如下：问题是图像和每篇文章都以不同的行显示。我试图浮动它们并使它们显示内联，但它没有帮助

<img src="img/sjlk.jpg" /> <!-- Logo -->


    <article>
        <h2>askdfbkansdkn </h2>
        <p>asdhfaksdhfk</p>
    </article>
    <article>
        <p>selnlnl sf</p>
        <p>shdfl</p>
        <p>aehfonlknslfn</p>
    </article>

我想让图片浮动到文章而不改变HTML结构

谢谢！

Answer 1

您需要包装<article> DIV。

<img src="img/sjlk.jpg" /> <!-- Logo -->
<div class="wrap">
<article>
    <h2>askdfbkansdkn </h2>
    <p>asdhfaksdhfk</p>
</article>
<article>
    <p>selnlnl sf</p>
    <p>shdfl</p>
    <p>aehfonlknslfn</p>
</article> 
</div>

CSS：

img, div.wrap {
   float: left;
}

显示文章旁边的图像

1 个答案: