Question

我正试图在@mobile屏幕上的表格中更改我所拥有的单元格的顺序，但是没有运气。

我的Mac宽度表是一个网格，具有不同的单元格大小，颜色，字体大小等，但在Mobile上我希望它是一个由水平线分隔的简单列表，每个项目都有一个链接。我设法做到了这一点，但我也想改变列表出现的顺序。

尝试添加div并按顺序排序，但它没有用。任何建议都是最受欢迎的！

这是我的HTML和移动CSS：

＆＃13;

                Uri uri = data.getData();
                ContentResolver cr = this.getContentResolver();
                String mime = cr.getType(uri);

＆＃13;

Answer 1

你可以考虑使用div而不是表格，并为行设置一个flexbox。改变列的顺序并不容易。

＆＃13;

.table {
  display: table;
  width: 100%;
}

.row {
  display: flex;
  justify-content: space-between;
  width: 100%;
  border-bottom: thin solid lightgray;
}

.cell {
  display: table-cell;
  padding: 0.5em;
}

.title {
  order: 2;
}

.name {
  order: 1;
}

.zip {
  order: 4;
}

.place {
  order: 3;
}

＆＃13;

<div class="table">
  <div class="row">
    <div class="cell title">Title</div>
    <div class="cell name">Name</div>
    <div class="cell zip">Zip</div>
    <div class="cell place">Place</div>
  </div>
  <div class="row">
    <div class="cell title">Title</div>
    <div class="cell name">Name</div>
    <div class="cell zip">Zip</div>
    <div class="cell place">Place</div>
  </div>
  <div class="row">
    <div class="cell title">Title</div>
    <div class="cell name">Name</div>
    <div class="cell zip">Zip</div>
    <div class="cell place">Place</div>
  </div>
</div>

＆＃13;

重新排列表格中的单元格顺序以进行移动

1 个答案: