аюсь создать адаптивный макет с Flexbox, который позволяет мне чередовать оба направленияrow а такжеrow-reverse.

Может быть, вы можете лучше понять это с помощью некоторого изображения (обратите внимание на порядок полей):

И изменение размера:

Или еще:

Вы можете представить стрелку, которая проходит через каждое поле, должно быть возможно пройти от 1 до 8, следуя последовательности чисел (как змея).

Как я могу добиться этого с помощью flexbox?

Я думаю, что я могу использоватьorder Свойство CSS, но мне не хватает динамического способа его установки. Я не думаю, что смогу достичь этого результата с помощью JavaScript, поскольку нет способа получить номер динамической строки (кроме как с безобразными взломами, и я хочу их избежать). Итак, у тебя есть идеи?

Спасибо.

Если вы хотите написать пример на основе моего кода, вы можете использовать это:

.flexbox-container {
  display: flex;
  flex-wrap: wrap;
}

.flex-item {
  width: 380px;
  height: 100px;
  background: red;
  margin: 5px;
  
  font-family: sans-serif;
  color: white;
  text-align: center;
  font-size: 2em;
  line-height: 150%;
}

<div class="flexbox-container">
  <div class="flex-item">1</div>
  <div class="flex-item">2</div>
  <div class="flex-item">3</div>
  <div class="flex-item">4</div>
  <div class="flex-item">5</div>
  <div class="flex-item">6</div>
  <div class="flex-item">7</div>
  <div class="flex-item">8</div>
</div>