master

分支 (1)

管理

管理

master

association_activities
/
index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>活动主页</title>
  <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css">
  <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.0/css/jquery-weui.min.css">
  <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
  <style>
  body{
    background: #f6f6f6;
  }
  .weui-grid__icon{
    text-align: center;
  }
  .weui-grid__icon i{
    font-size: 30px;
    color: #1f8be8;
  }
  .nav{
    background: #fff;
  }
  .recommend h3{
    color: #333;
    font-size: 18px;
  }
  .recommend .weui-media-box_appmsg .weui-media-box__hd{
    width: 175px;
    height: 102px;
  }
  .recommend .weui-media-box_appmsg .weui-media-box__thumb{
    vertical-align: middle;
  }
  .recommend .weui-media-box{
    position: relative;
  }
  .activity-title{
    font-size: 15px;
    line-height: 18px;
    position: absolute;
    top: 13px;
    word-break: break-all;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
  }
  .activity-info{
    font-size: 12px;
    line-height: 16px;
    color: #7b7b7b;
  }
  .activity-price{
    font-size: 14px;
    color: #ff9e00;
    position: absolute;
    bottom: 12px;
  }
  .activity-num{
    font-size: 12px;
    color: #f93;
    background: #fff7ef;
    padding: 2px;
    border: 1px solid #f93;
    border-radius: 2px;
    position: absolute;
    bottom: 12px;
    right: 15px;
  }
  </style>
</head>
<body>
  <!-- 分类九宫格 -->
  <div class="weui-flex nav">
    <div class="weui-flex__item">
      <div class="weui-grids">
        <a href="list.html" class="weui-grid js_grid">
          <div class="weui-grid__icon">
            <i class="fa fa-bank"></i>
          </div>
          <p class="weui-grid__label">
            线下活动
          </p>
        </a>
        <a href="" class="weui-grid js_grid">
          <div class="weui-grid__icon">
            <i class="fa fa-cubes"></i>
          </div>
          <p class="weui-grid__label">
            线下交流会
          </p>
        </a>
        <a href="" class="weui-grid js_grid">
          <div class="weui-grid__icon">
            <i class="fa fa-futbol-o"></i>
          </div>
          <p class="weui-grid__label">
            线下课程
          </p>
        </a>
        <a href="" class="weui-grid js_grid">
          <div class="weui-grid__icon">
            <i class="fa fa-gamepad"></i>
          </div>
          <p class="weui-grid__label">
            线下课程
          </p>
        </a>
        <a href="" class="weui-grid js_grid">
          <div class="weui-grid__icon">
            <i class="fa fa-group"></i>
          </div>
          <p class="weui-grid__label">
            线下课程
          </p>
        </a>
        <a href="" class="weui-grid js_grid">
          <div class="weui-grid__icon">
            <i class="fa fa-paper-plane"></i>
          </div>
          <p class="weui-grid__label">
            线下课程
          </p>
        </a>
      </div>
    </div>
  </div>

  <!-- 推荐活动 -->
  <div class="weui-panel weui-panel_access recommend">
    <div class="weui-panel__hd"><h3>推荐活动</h3></div>
    <div class="weui-panel__bd">
      <a href="info.html" class="weui-media-box weui-media-box_appmsg">
        <div class="weui-media-box__hd">
          <img class="weui-media-box__thumb" src="img.jpg">
        </div>
        <div class="weui-media-box__bd">
          <p class="activity-title">亚马逊A战队孵化营发布会 暨 一周年庆典</p>
          <p class="activity-info">2018-06-26</p>
          <p class="activity-info">深圳</p>
          <p class="activity-price">￥<span>88</span></p>
          <p class="activity-num">88人报名</p>
        </div>
      </a>
      <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg">
        <div class="weui-media-box__hd">
          <img class="weui-media-box__thumb" src="img.jpg">
        </div>
        <div class="weui-media-box__bd">
          <p class="activity-title">亚马逊A战队孵化营发布会 暨 一周年庆典</p>
          <p class="activity-info">2018-06-26</p>
          <p class="activity-info">深圳</p>
          <p class="activity-price">免费</p>
          <p class="activity-num">88人报名</p>
        </div>
      </a>
      <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg">
        <div class="weui-media-box__hd">
          <img class="weui-media-box__thumb" src="img.jpg">
        </div>
        <div class="weui-media-box__bd">
          <p class="activity-title">亚马逊A战队孵化营发布会 暨 一周年庆典</p>
          <p class="activity-info">2018-06-26</p>
          <p class="activity-info">深圳</p>
          <p class="activity-price">免费</p>
          <p class="activity-num">88人报名</p>
        </div>
      </a>
      <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg">
        <div class="weui-media-box__hd">
          <img class="weui-media-box__thumb" src="img.jpg">
        </div>
        <div class="weui-media-box__bd">
          <p class="activity-title">亚马逊A战队孵化营发布会 暨 一周年庆典</p>
          <p class="activity-info">2018-06-26</p>
          <p class="activity-info">深圳</p>
          <p class="activity-price">免费</p>
          <p class="activity-num">88人报名</p>
        </div>
      </a>
      <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg">
        <div class="weui-media-box__hd">
          <img class="weui-media-box__thumb" src="img.jpg">
        </div>
        <div class="weui-media-box__bd">
          <p class="activity-title">亚马逊A战队孵化营发布会 暨 一周年庆典</p>
          <p class="activity-info">2018-06-26</p>
          <p class="activity-info">深圳</p>
          <p class="activity-price">免费</p>
          <p class="activity-num">88人报名</p>
        </div>
      </a>

    </div>

  </div>


</body>
</html>