Microfilm_Project/dateHTMLsrc/wholeTemplate.html

<div class='Analytics-report-page'>
    <img style="position: absolute;" class='Orange2' src="./img/背景橘.png" alt="">
    <img style="position: absolute;" class='Purple2' src="./img/背景紫.png" alt="">
    <div class='text-end mb-3'>
      <img class='choozmo mt-2 me-3' src="./img/logo_choozmo.webp" alt="">
    </div>
    <div class='Analytics-chart'>
      <div class="row mx-0 px-0">
        <div class="row mx-0">
          <div class="col-12 col-sm-6 col-md-6">
            <h2 class='Data-h2 fw-bold'>科專成果之微電影映後聲量調查與分析(YT)</h2>
          </div>
          <div class="col-12 col-sm-6  col-md-6">
            <h2 class='Data-h2 fw-bold'>科專成果之微電影映後聲量調查與分析(FB)</h2>
          </div>
        </div>
      </div>
      <div class="row mx-0 px-0">
        <div class="row mx-0">
          <div class="col-6">
            <table class="table-1 table table-bordered mt-1">
              <thead>
                <tr>
                  <th scope="col" class='text-center'>頻道名稱</th>
                  <th scope="col" class='text-center'>訂閱數</th>
                  <th scope="col" class='text-center'>簡介</th>
                  <th scope="col" class='text-center'>影片標題</th>
                  <th scope="col" class='text-center'>日期</th>
                  <th scope="col" class='text-center'>觀看數</th>
                  <th scope="col" class='text-center'>按讚數</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <th scope="row" style="width: 25%;" class='px-0 text-center'>時間長短</th>
                  <td class='text-center'>1分鐘-5分鐘</td>
                  <td class='text-center'>1分鐘-10分鐘</td>
                  <td class='text-center'>2分鐘-15分鐘</td>
                  <td class='text-center'>2分鐘-15分鐘</td>
                  <td class='text-center'>2分鐘-15分鐘</td>
                  <td class='text-center'>2分鐘-15分鐘</td>
                </tr>
              </tbody>
            </table>
            
          </div>
          <div class="col-6">
            <table class="table-1 table table-bordered mt-1">
              <thead>
                <tr>
                  <th scope="col" style="width: 18%;">社團名稱</th>
                  <th scope="col" class='text-center'>社團按讚</th>
                  <th scope="col" class='text-center'>貼文按讚</th>
                  <th scope="col" class='text-center'>貼文內容</th>
                  <th scope="col" class='text-center'>日期</th>
                  <th scope="col" class='text-center'>分享數</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <th scope="row" style="width: 25%;" class='px-0 text-center'>時間長短</th>
                  <td class='text-center'>1分鐘-5分鐘</td>
                  <td class='text-center'>1分鐘-10分鐘</td>
                  <td class='text-center'>2分鐘-15分鐘</td>
                  <td class='text-center'>2分鐘-15分鐘</td>
                  <td class='text-center'>2分鐘-15分鐘</td>
                </tr>
           
              </tbody>
            </table>
            
          </div>

        </div>
      </div>

    </div>
    <div class='pagenumber'>
      <p>1</p>
    </div>
  </div>