zoukankan      html  css  js  c++  java
  • 微信小程序怎么做出前端table的效果

    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">{{内容}}</view>
                <view class="td">{{内容}}</view>
                <view class="td">{{内容}}</view>
                <view class="td">{{内容}}</view>
                <view class="td">{{内容}}</view>
            </view>
        </view>
    </view>
     
    wxss代码:

    /* pages/table/table.wxss */
    page {
      font-size: 14px;
      color: #333
    }
    .table {
      border:1px solid #dadada;
      border-right: 0;
      border-bottom: 0;
       98%;
    }
    .tr {
       100%;
      display: flex;
      justify-content: space-between;
    }
    .th,.td {
      padding: 10px;
      border-bottom: 1px solid #dadada;
      border-right: 1px solid #dadada;
      text-align: center;
      100%
    }
    .th {
      font-weight: 400;
      background-color: #dadada
    }

  • 相关阅读:
    手动安装ceph集群
    openstack端口禁用安全规则
    debian10桌面美化
    debian10 制作动态扩容根分区镜像
    CentOS7制作动态扩容根分区镜像
    EFKLK日志收集工具栈
    ceph rbd(csi) 对接 kubernetes sc
    secureCRT 814配色方案
    python function
    Linux操作篇之LNMP(一)
  • 原文地址:https://www.cnblogs.com/h5kang/p/6247603.html
Copyright © 2011-2022 走看看