微信小程序沒有table標簽，運用display:table和display:flex實現一個內容字數不固定表格……
wxml：
<view class="ContentShow">
<view class="conht">煙臺市新聞發布會登記審批表</view>
<view class="table">
<view class="tr">
<view class="td">新聞發布會名稱</view>
<view class="td">{{ContentData.title}}</view>
</view>
<view class="tr">
<view class="td">發布單位</view>
<view class="td">{{ContentData.name}}</view>
</view>
<view class="tr">
<view class="td">發布人姓名、職務</view>
<view class="td">{{ContentData.publisher}}、{{ContentData.publisher_post}}</view>
</view>
<view class="tr">
<view class="td">主持人姓名、職務</view>
<view class="td">{{ContentData.host}}、{{ContentData.host_post}}</view>
</view>
<view class="tr">
<view class="td">媒體發布范圍</view>
<view class="td">{{ContentData.nrangeame}}</view>
</view>
<view class="tr">
<view class="td">發布會舉辦時間</view>
<view class="td">{{ContentData.start_time}}至{{ContentData.end_time}}</view>
</view>
<view class="tr">
<view class="td">發布會舉辦地點</view>
<view class="td">{{ContentData.place}}</view>
</view>
<view class="tr">
<view class="td">是否報經分管市領導同意</view>
<view class="td">{{ContentData.place}}</view>
</view>
<view class="trOne">
<text>發布會主要內容</text>
<rich-text nodes="{{ContentData.content}}"></rich-text>
</view>
<view class="trTwo">
<view class="colus">
<text class="txtLine">主管部門意見</text>
<view class="coluCont"><text>(蓋章) 年 月 日</text>
</view>
</view>
<view class="colus">
<text class="txtLine">市政府新聞辦意見</text>
<view class="coluCont"><text>(蓋章) 年 月 日</text>
</view>
</view>
</view>
<view class="tr">
<view class="td">主要負責任人、聯系方式</view>
<view class="td">{{ContentData.chargeperson_main}}</view>
</view>
<view class="tr" style="display:{{returnReason}}">
<view class="td">駁回原因</view>
<view class="td">{{ContentData.reason}}</view>
</view>
</view>
</view>wxss：
.table{border-left:1px solid #666;border-top:1px solid #666;font-size:.9rem;line-height:1.6rem;color:#666;margin:1.5rem 1.5rem 1rem 1.5rem;}
.tr{width:100%;display:table;}
.td{padding:0.2rem 0.5rem;text-align:center;box-sizing:border-box;display:table-cell;vertical-align:middle;}
.tr view:nth-child(1){width:30%;}
.tr view:nth-child(2){flex:1;width:70%;}.trOne{border-right:1px solid #666;box-sizing:border-box;padding:0.5rem;border-bottom:1px solid #666;}
.trOne text{display:block;text-align:center;padding-bottom:.5rem;}.trTwo{display:flex;justify-content:space-between;box-sizing:border-box;}
.colus{flex:1;}
.txtLine{display:block;text-align:center;border-bottom:1px solid #666;}
.coluCont{min-height:5rem;align-items:flex-end;display:flex;}
.coluCont text{display:block;text-align:right;width:100%;padding-right:0.5rem;box-sizing:border-box;}.td,.colus{border-bottom:1px solid #666;border-right:1px solid #666;}
