Html Div表响应-报头重复

我有一个DIV表，它是完全响应。当我们在小屏幕上查看时，桌子的头部应该在每个部分重复。现在它显示在第一部分，但第二部分缺少标题

如何在小屏幕上显示每个部分的标题？看起来像这个示例：（这个示例是一个tr-td表，我的表是一个DIV表）

注意：需要最小化浏览器以查看表

演示：

CSS

HTML

标题01
标题02
标题03
第01-1行
第02-1行
第03-1行
第01-2行
第02-2行
第03-2行

---

如果您运行您提供的代码段，这就是结果。我假设这是您想要的，但是，我确实看到您的css中有很多冗余。例如，为什么有两个类row1和row2，而它们是相同的东西？除非您计划在以后更改它，使它们不同。

使用Flexyou可以实现这一点>请参阅下面的示例代码。希望有帮助

.footer\u mainDIV{
显示器：flex；
柔性包装：包装；
弯曲方向：立柱；
}
.标题{
宽度：100%；
浮动：左；
}
.校长1{
宽度：33%；
浮动：左；
背景：#ccc；
高度：25px；
}
.第1行，
.row2{
宽度：33%；
浮动：左；
背景：ddd；
高度：25px；
}
@介质和全部（最大宽度：480px）{
.footer_mainDIV{
弯曲方向：行；
柔性包装：nowrap；
文本对齐：居中；
}
.标题{
身高：100%；
浮动：左；
背景：红色！重要；
弹性：1；
/*添加其他与路线相关的样式*/
}
.校长1，
.第1行，
.row2{
宽度：100%！重要
}
.行{
弹性：1；
边缘底部：5px；
背景：绿色！重要；
}
}

标题01
标题02
标题03
第1-1行
第1-2行
第1-3行
第2-1行
第2-2行
第3-3行

谢谢你，非常感谢你的帮助！可能是因为我没有清楚地描述，我运行了你的代码，没有得到预期的表。请看一下我刚刚编辑的上述问题。谢谢。谢谢你，崔妮。非常感谢你的帮助！你是对的，我只是很快写了我的CSS，看看它看起来如何。请看一下我刚刚编辑的上述问题。谢谢

.header {
  width: 100%;
  float: left;
}
.header1 {
  width: 33%;
  float:left;
  background: #bbb;
  height: 25px;
}
.row1, .row2 {
  width: 33%;
  float:left;
  background: #ddd;
  height: 25px;
}
@media all and (max-width: 480px)
 {
   .header
   {
     width:40%;
     height: 100%;
     float:left;
      background: red !important;

    }
    .header1, .row1, .row2 {width: 100% !important}
    .row {
      width: 60% !important; margin-bottom: 5px; float:left
      }
 }

<div class="table">
    <div class="header">
        <div class="header1">
              Header 01
        </div>
        <div class="header1">
              Header 02
        </div>
        <div class="header1">
              Header 03
        </div>
    </div>
    <div class="row">
        <div class="row1">
              row 01-1
        </div>
        <div class="row1">
              row 02-1
        </div>
        <div class="row1">
              row 03-1
        </div>
    </div>
    <div class="row">
      <div class="row2">
        row 01-2
      </div>
      <div class="row1">
        row 02-2
      </div>
      <div class="row1">
        row 03-2
      </div>
    </div>
</div>