微信小程序表格制作

*.js

msg:'数据'

*.wxml

< view class= "container">

< view class= "table">

< view class= "tr">

< view class= "th">标题1 </ view >

< view class= "th">标题2 </ view >

< view class= "th">标题3 </ view >

< view class= "th">标题4 </ view >

< view class= "th">标题5 </ view >

</ view >

< view class= "tr" wx:for= "{{5}}">

< view class= 'td'> {{msg}} </ view >

< view class= "td"> {{msg}} </ view >

< view class= "td"> {{msg}} </ view >

< view class= "td"> {{msg}} </ view >

< view class= "td"> {{msg}} </ view >

</ view >

</ view >

</ view >

*.wxss

.table {

border: 5px solid rebeccapurple;

border-right: 0;

border-bottom: 0;

width: 98%;

}

.tr {

width: 100%;

display: flex;

justify-content: space-between;

}

.th, .td {

padding: 10px;

border-bottom: 1px solid #dadada;

border-right: 1px solid #dadada;

text-align: center;

width: 100%;

}

.th {

font-weight: 400;

background-color: #dadada;

}