<template>
  <div class="main">
    <ul class="list">
      <a href="http://sjzj.tjj.zhenjiang.gov.cn/mbWeb_ZJWX.action?fromRKX=nd">
        <li class="clearfix" style="background:#50EF9F">
          <div class="pic">年度数据</div>
          <div class="right">></div>
        </li>
      </a>
      <a href="http://sjzj.tjj.zhenjiang.gov.cn/mbWeb_ZJWX.action?fromRKX=jind">
        <li class="clearfix" style="background:#FF8C4B">
          <div class="pic">进度数据</div>
          <div class="right">></div>
        </li>
      </a>
      <a href="http://sjzj.tjj.zhenjiang.gov.cn/mbWebZHENJIANG_TJXX.action?fromRKX=tjyb">
        <li class="clearfix" style="background:#FF5B9D">
          <div class="pic">统计月报</div>
          <div class="right">></div>
        </li>
      </a>
      <a href="http://sjzj.tjj.zhenjiang.gov.cn/mbWebZHENJIANG_TJXX.action?fromRKX=tjhc">
        <li class="clearfix" style="background:#5AA7FF">
          <div class="pic">统计概览</div>
          <div class="right">></div>
        </li>
      </a>
      <a href="http://sjzj.tjj.zhenjiang.gov.cn/mbWebZHENJIANG_TJXX.action?fromRKX=tjfg">
        <li class="clearfix" style="background:#FFA900">
          <div class="pic">统计法规</div>
          <div class="right">></div>
        </li>
      </a>
      <a href="http://sjzj.tjj.zhenjiang.gov.cn/mbWebZHENJIANG_TJXX.action?fromRKX=tjzs">
        <li class="clearfix" style="background:#EB4E3F">
          <div class="pic">统计知识</div>
          <div class="right">></div>
        </li>
      </a>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
};
</script>

<style lang="stylus" scoped>
.list::-webkit-scrollbar {
    display: none;
}
.list{
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow auto;
}
.clearfix{
    width: 650px;
    height: 200px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 15px 20px;
    color: #fff;
    border-radius: 10px;
}
</style>