html - 如何在一行中显示这些内容？

Question

我试图将此内容显示在一行中，以便它在我的页面左侧显示“购物”，在右侧“右侧”div 中显示内容。我试过将 div 向右浮动，但没有用。

非常感谢任何帮助。

<header>
    <h1>Shopping</h1>
    <div id="cart"
        <a href="#"><img src="images/cart.png" width="80" height="80"></a>
        <p> Cart: 0 </p>
        <a href="#">Login</a>
    </div>
</header>

Like this

Answer 1

<h1>和 <div>是block元素，所以他们每人占一整行。您必须如下制作它们才能在一行中显示它们。

header h1, header #cart {
    display:inline-block;
}

好吧，还有几种方法可以将它们显示在一行中，但这是最简单的。