移动端表格
html

正常
偏低
偏高
严重偏低
严重偏高
  • 日期
  • 凌晨
  • 早餐前
  • 早餐后
  • 午餐前
  • 午餐后
  • 晚餐前
  • 晚餐后
  • 睡前
  • {{item.year}}
    {{item.monthDay}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
  • -
    {{item1.time | timestampTo3}}
    {{item1.value==1.1||item1.value<1.1?'low':item1.value>33?'high':item1.value}}
***style*** /* 表格 */ /* .table { padding: 30px 0 0 0 ; } */ .table_thead { height: 0.5rem; width: 100%; display: flex; } .table_thead li { /* height: .5rem; */ color: #fff; font-size: 0.12rem; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 600; line-height: 0.13rem; padding: 0 0.1rem; height: 0.5rem; width: calc((100% - 8px) / 9 - 0.2rem); border-right: 1px solid #fff; background: rgba(40, 155, 206, 1); text-align: center; display: flex; justify-content: center; align-items: center; } .table_thead li:last-child { border-right: none; } .table_tbody { width: 100%; } .table_tr { /* height: 0.5rem; */ width: 100%; /* display: flex; */ border-right: 0.01rem solid #ddd; border-bottom: 0.01rem solid #ddd; } .table_tr li { /* height: 100%; */ padding: 0 0.01rem; /* height: 0.5rem; */ width: calc((100% - 8px) / 9); background: #fff; display: flex; flex-wrap: wrap; /* align-items: center; */ /* align-content: space-around; */ text-align: center; border-right: 0.01rem solid #ddd; } .table_tr li:nth-child(2) { border-left: 0.01rem solid #ddd; } .table_tr li:last-child, .table_tr li:nth-child(1) { border-right: none; } .table_date { width: 100%; font-size: 0.12rem; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 600; color: rgba(51, 51, 51, 1); line-height: 0.13rem; text-align: center; } .tr_time, .tr_value, .tr_status { width: 100%; height: 0.1rem; line-height: 0.13rem; font-size: 0.1rem; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(51, 51, 51, 1); } .tr_value { font-size: 0.12rem; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 400; color: rgba(51, 51, 51, 1); } .tr_status { font-size: 0.12rem; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(40, 155, 206, 1); } .fc_1 { /* color: #333333; */ color: green; } .fc_2 { /* color: #ff831b; */ color: orange; } .fc_3 { /* color: #1e6eaf; */

color: red;
}

相关文章:

  • 2021-10-10
  • 2021-07-19
  • 2022-01-08
  • 2021-11-22
  • 2022-03-02
  • 2022-01-26
  • 2021-05-06
  • 2022-12-23
猜你喜欢
  • 2021-12-10
  • 2021-11-23
  • 2022-02-19
  • 2021-12-30
  • 2022-12-23
  • 2022-02-28
  • 2022-01-03
相关资源
相似解决方案