我有多个article
元素,它们的顺序相反,但是第一个元素是header
元素,我需要它在顶部是粘性的,
除了第一个header元素之外,我如何反转所有项?
#content {
display: flex;
flex-direction: column-reverse;
}
和
<div id="content">
<header>something</header>
<article>1</article>
<article>2</article>
<article>3</article>
<article>4</article>
<article>5</article>
</div>
最佳答案
使用order
属性。https://developer.mozilla.org/en-US/docs/Web/CSS/order
#content {
display: flex;
flex-direction: column-reverse;
}
header {
order: 1;
}
<div id="content">
<header>something</header>
<article>1</article>
<article>2</article>
<article>3</article>
<article>4</article>
<article>5</article>
</div>