Question

我有一个<section>标记用作其他多个元素的容器。作为<section>标签的兄弟，我有一个<h1>用作排序计时器。事实是，<section>标签的位置恰好是我希望它在没有<h1>的情况下放置的，当<h1>存在时，它会移动{{1 }}结束。如何使用<section>标签而不将<h1>标签移到上方？谢谢！（下面需要CSS）

<section>

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    height: 100vh;
    display: flex;
    margin: 0 auto;
}

/* The <h1> mentioned above*/
.timer {
    margin: 10px;
    font-family: roboto;
    color: #F6E71D;
    font-weight: 100;
    font-size: 25px;
}

/*The container mentioned above*/
#card-container {
    width: 640px;
    height: 640px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    perspective: 1000px;
}

Answer 1

如果您的目标是将计时器放在左上角，并且不影响其他元素，请为它指定css属性position: absolute;，然后进行其余样式设计，以将内容放置在所需的位置。这样，它不会影响其他元素的位置。如果您尚未研究Flexbox或CSS网格，我强烈建议您使用它们。它使布局样式更容易。

如何使HTML元素忽略另一个元素的位置？

1 个答案: