自定义三级表格,方便数据循环


<div class="m_table_box">
<div class="m_table">
<div class="m_cell m_td" style=" 100px"><b>老板</b></div>
<div class="m_cell m_td" style=" 200px"><b>通店俱乐部名称</b></div>
<div class="m_cell m_td"><b>已通会员卡卡种</b></div>
</div>
<div class="m_table">
<div class="m_cell m_td m_vertical" style=" 100px">张三1</div>
<div class="m_cell">
<div class="m_table">
<div class="m_cell m_td m_vertical" style=" 200px">
A店1
</div>
<div class="m_cell">
<div class="m_table">
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
</div>
<div class="m_table">
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
</div>
</div>
</div>
<div class="m_table">
<div class="m_cell m_td" style=" 200px">
A店1
</div>
<div class="m_cell">
<div class="m_table">
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
</div>
<div class="m_table">
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
<div class="m_cell m_td">11</div>
</div>
</div>
</div>
</div>
</div>
</div>
.m_table{
display: table;
100%;
}
.m_cell{
display: table-cell;
}
.m_table_box{
border-top:1px solid #f4f4f4;
border-left:1px solid #f4f4f4;
}
.m_td{
border-right:1px solid #f4f4f4;
border-bottom:1px solid #f4f4f4;
padding: 8px;
}
.m_vertical{
vertical-align:middle;
}


原文地址:https://www.cnblogs.com/yuyedaocao/p/10063694.html