开发文档

简介

探索多多28,體驗領先的體育娛樂平台。從此開始,享受多元化賽事報導與頂級娛樂內容,開啟您的精彩旅程。

快速上手

歡迎來到多多28,您的專屬體育娛樂平台。立即下載 App,暢享即時賽事更新與豐富娛樂體驗。

CSS

將此 CSS 連結加入您的 HTML `<head>` 區塊,確保其優先載入,以正確呈現多多28的視覺風格。

<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />

JS

為了啟用多多28平台的互動功能,請將以下 JavaScript 程式碼置於 `</body>` 標籤前。請確保 jQuery 已先載入,再依序載入 Bootstrap 與多多28的專屬腳本。

jquery.min.js
bootstrap.bundle.min.js

基礎架構

確保您的網頁遵循最新的網頁標準,包含 HTML5 doctype 及響應式設計所需的 viewport meta 標籤,以提供最佳瀏覽體驗。

HTML 結構:
<!doctype html>
<html lang="zh-TW">
    <head>

        <meta charset="utf-8" />
        <title>多多28大舞台</title>多多28 - 官方文件</title>
        viewport
        多多28官方網站,領先的體育娛樂平台,提供多元化賽事報導與優質娛樂體驗,盡享互動樂趣。
        keywords

        <!-- 图标 -->
        favicon

        <!-- Bootstrap -->
        bootstrap.min.css

        <!-- 主样式 -->
        style.css
    
    </head>

    <body>

        <!-- 加载动画开始 -->
        <div id="loader">
            --------
            --------
        </div>
        <!-- 加载动画结束 -->

        <!-- 导航栏开始 -->
        <header>
            <div class="container">
                --------
                --------
                --------
                --------
            </div>
        </header>
        <!-- 导航栏结束 -->

        <!-- 英雄区域开始 -->
        <section class="hero">
            <div class="container">
                --------
                --------
                --------
                --------
            </div>
        </section>
        <!-- 英雄区域结束 -->

        <!-- 页脚开始 -->
        <footer>
            <div class="container">
                --------
                --------
                --------
                --------
            </div>
        </footer>
        <!-- 页脚结束 -->

        <!-- 返回顶部开始 -->
        <a href="#" class="btn-download" id="btn-appstore">
            --------
            --------
        </a>
        <!-- 返回顶部结束 -->

        <!-- JavaScript开始 -->
        jquery-3.4.1.min.js
        bootstrap.bundle.min.js
        --------
        --------
        --------
        <script src="js/app.js"></script>
        <!-- JavaScript结束 -->
    </body>
</html>
                        
RTL 版本
RTL 版本 :

啟用 RTL(由右至左)閱讀模式,請將 `style.css` 替換為 `style-rtl.css`。

夜間模式
夜間模式 :

切換至夜間模式,請將 `style.css` 替換為 `style-dark.css`。

夜間 RTL 模式 :

啟用夜間模式並支援 RTL 閱讀,請將 `style.css` 替換為 `style-dark-rtl.css`。

菜单
選單置中靠右

若要將導航選單從置中調整至靠右對齊,請在 `navigation-menu` 類別後方新增 `nav-right` 類別。

選單置中靠左

若要將導航選單從置中調整至靠左對齊,請在 `navigation-menu` 類別後方新增 `nav-left` 類別。

選單亮色置中

若需置中且採用亮色風格的導航選單,請在 `navigation-menu` 類別後方新增 `nav-light` 類別。

選單亮色靠右

若需右對齊且採用亮色風格的導航選單,請在 `navigation-menu` 與 `nav-right` 類別後方新增 `nav-light` 類別。

選單亮色靠左

若需左對齊且採用亮色風格的導航選單,請在 `navigation-menu` 與 `nav-left` 類別後方新增 `nav-light` 類別。