<template>
    <div class="container">
    <section class="introduction">
    
      <div class="pageTitle">
        <h1 class="coinbus">欢迎来到 coinbus 数据分析平台</h1>
        <div class="Mask"></div>
      </div>
      <section class="block">
        <div class="title">
            <img src="../../assets/imgs/majorFunction.png" alt="">
            <h4>              
                网站主要功能
            </h4>
        </div>
        <div class="text">
            <p>我们的平台提供全面的区块链数据分析服务，包括但不限于以下功能：</p>
            <ul>
            <li>
                <i class="fas fa-bolt"></i> 实时监控区块链网络上的交易数据。
            </li>
            <li>
                <i class="fas fa-chart-pie"></i> 深入分析各种加密货币的市场指标。
            </li>
            <li>
                <i class="fas fa-search-dollar"></i> 提供大额交易监控，及时掌握重要资金动向。
            </li>
            <li>
                <i class="fas fa-arrows-alt-h"></i> 分析加密货币的流通量变化趋势。
            </li>
            <li>
                <i class="fas fa-globe"></i> 对宏观经济与加密货币的关联进行深度剖析。
            </li>
            </ul>
        </div>
     
      </section>
      <section  class="block">
        <div class="title">
            <img src="../../assets/imgs/advantage.png" alt="">
            <h4>              
                网站优点
            </h4>
        </div>
        <div class="text">
            <p>关于我们：</p>
        <ul>
          <li>
            <i class="fas fa-check-circle"></i> 精准的数据来源：我们从可靠的渠道获取数据，确保分析结果的准确性。
          </li>
          <li>
            <i class="fas fa-chart-area"></i> 直观的可视化展示：通过清晰的图表和图形，让用户轻松理解复杂的数据。
          </li>
          <li>
            <i class="fas fa-bell"></i> 个性化的订阅服务：用户可以根据自己的需求定制数据分析报告和通知。
          </li>
          <li>
            <i class="fas fa-shield-alt"></i> 强大的后台管理：确保数据的安全性和稳定性，同时提供高效的问题处理机制。
          </li>
        </ul>
    </div>
      </section>
      <section class="block">
        <div class="title">
            <img src="../../assets/imgs/why.png" alt="">
            <h4>              
                为什么选择我们网站
            </h4>
        </div>
        <div class="text">
        <p>在众多的数据分析平台中，我们脱颖而出的原因有以下几点：</p>
        <ul>
          <li>
            <i class="fas fa-users"></i> 专业的团队：我们拥有一支经验丰富的数据分析专家和技术团队。
          </li>
          <li>
            <i class="fas fa-sync-alt"></i> 持续的更新与改进：不断跟进市场动态，为用户提供最新的数据分析和功能。
          </li>
          <li>
            <i class="fas fa-user-friends"></i> 用户友好的界面：即使是没有专业技术背景的用户也能轻松上手。
          </li>
          <li>
            <i class="fas fa-headset"></i> 优质的客户服务：及时响应用户的问题和需求，提供全方位的支持。
          </li>
        </ul>
    </div>
      </section > 
      <section class="block">
        <div class="title">
            <img src="../../assets/imgs/doWhat.png" alt="">
            <h4>              
                我们的网站是做什么的
            </h4>
        </div>
        <div class="text">
        <p>我们致力于为用户提供专业的区块链数据分析服务，帮助用户更好地理解加密货币市场和区块链技术。通过我们的平台，用户可以：</p>
        <ul>
          <li>
            <i class="fas fa-chart-line"></i> 深入了解加密货币的价格走势和市场趋势。
          </li>
          <li>
            <i class="fas fa-lock"></i> 分析区块链网络的安全性和稳定性。
          </li>
          <li>
            <i class="fas fa-briefcase"></i> 评估不同加密货币项目的潜力和风险。
          </li>
          <li>
            <i class="fas fa-calculator"></i> 制定更明智的投资决策和风险管理策略。
          </li>
          </ul>
         </div>
      </section>
      <section class="block">
        <div class="title">
            <img src="../../assets/imgs/dataAnalysis.png" alt="">
            <h4>              
                包含哪些数据分析
            </h4>
        </div>
        <div class="text">
        <p>我们的平台涵盖了广泛的数据分析内容，包括：</p>
        <ul>
          <li>
            <i class="fas fa-cubes"></i> 链上数据：如交易数量、交易金额、活跃地址、长/短期持有者交易量、供应量、盈亏比等。
          </li>
          <li>
            <i class="fas fa-money-bill-wave"></i> 市场指标：价格走势、市值、交易量、币价市值排名等。
          </li>
          <li>
            <i class="fas fa-exchange-alt"></i> 交易所数据：交易所的交易量、持仓量、资金流入流出、资金费率等。
          </li>
          <li>
            <i class="fas fa-chart-bar"></i> 宏观经济数据：与加密货币相关的宏观经济指标分析、纳斯达克指数、GDP、债券、资讯等。
          </li>
          <li>
            <i class="fas fa-search-dollar"></i> 大额交易监控：跟踪大额交易，分析资金流向。
          </li>
         </ul>
         </div>
      </section>
    </section>
    </div>
  </template>
  
  <script>
  export default {
    name: 'WebsiteIntroduction',
    data() {
      return {};
    },
  };
  </script>
  
  <style scoped lang="scss">
  .container {
    width: 100%;
   padding: 4px;
  }
  .introduction{
    width: 80%;
    margin: 0 auto;
  }
  .pageTitle{   
    width: 100%;
    height: 400px; 
    background-image: url("../../assets/imgs/topbg.jpg") !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 100%;
    text-align: center;
    color: #fff;
    position: relative;


  }

  .Mask{  
    width: 100%;
    height: 100%;
    /* z-index: 5; */
    min-height: 200px; 
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.3);
    z-index: 1;

  }

  .block{
    width: 100%;  
    display: flex;
    padding: 30px;
    border-bottom: 1px solid #ccc;
  }
  .title{
    width: 180px;
    text-align: center;
    color: rgba(0,0,0,0.78);
    img{
        width: 70%;

    }

  }
  .text{
    margin-left: 5%;
    color: rgba(0,0,0,0.7);
    ul{
        margin-left: 28px;

        li{
            list-style: disc;
        }
    }
  }
  
  h1 {
    font-size: 32px;
    margin-bottom: 20px;  
    /* background: palegreen; */
    position: absolute;
    z-index: 9;
    top: 18%;
    left: 35%;
  }
  
  h2 {
    font-size: 24px;
    margin-bottom: 15px;
  }
  
  ul {
    list-style-type: none;
    padding-left: 0;
  }
  
  li {
    margin-bottom: 10px;
  }
  
  i {
    margin-right: 10px;
  }
  </style>
  
  <!-- 确保引入 Font Awesome 图标库 -->
  <link
    rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
  />