次の HTML コードを考えてみましょう
リーリー私が必要とするのは、HTML 内の位置を変更するのではなく、クラス名を変更することで、ブラウザー ビューの上部に 3 番目のコンテンツを表示することです。 同時に、変更に対する応答性を維持する必要があります。
私のHTMLコードは次のとおりです
リーリー
P粉2074830872023-09-09 11:07:58
グリッドシステムを使用して注文します。次に、js を使用してシーケンス番号を変更し、3 番目の div が最初になるようにします。これが解決策になると思いますか?
詳細については、こちらをご覧ください: https://developer.mozilla.org/en-US/docs/Web/CSS/order
リーリーその後、JS を使用してシーケンス番号を変更できます
P粉2041364282023-09-09 09:43:19
.wrapper{
display: flex;
flex-flow: column;
}
.first{
order: 3;
}
.second{
order: 2;
}
.third{
order: 1;
}
<html>
<head>
</head>
<body>
<div class="wrapper">
<section class="first">First Content</section>
<section class="second">Second Content</section>
<section class="third">ThirdContent</section>
</div>
</body>
</html>